JQuery将textarea的内容加载到IFrame中 [英] JQuery Loading Content of textarea into IFrame
问题描述
我有一个HTML textarea和一个IFrame。点击按钮后，我希望能够将textarea的内容加载到IFrame中。例如，当用户输入 Hello World 到textarea中，并按下提交按钮时，文本 Hello World 会显示在IFrame中。
关于如何完成这些任何想法？提前致谢。
注意：我想使用JQuery，但我认为我必须为此使用PHP。这听起来更像服务器端。
您可以仅使用jquery来定位iframe：
< html>
< head>
< script type =text / javascript>
jQuery（document）.ready（function（）{
jQuery（'＃btnSubmit'）。click（function（）{
var content = $（＃test）。val ）;
$（'＃iframe1'）。contents（）。find（'p'）。html（content）;
}）;
}）;
< / script>
< / head>
< body>
< button id =btnSubmit>发布到iFrame< /按钮>
< iframe name =iframe1id =iframe1src =test2.html>< / iframe>
< / body>
< / html>
您的iframe内容页面（在本例中为test2.html）会有这样的内容：
< html>
< body>
< p> [介绍文字或其他内容]< / p>
< / body>
< / html>
以前的S / O贴子有类似的问题：在iFrame jQuery中选择一个元素
I have an HTML textarea, and an IFrame. On a button click, I would like to be able to load the content of the textarea into the IFrame.
For example, when the user types in Hello World into the textarea, and presses the submit button, the text Hello World would show up in the IFrame.
Any ideas on how this could be done? Thanks in advance.
NOTE: I would like to use JQuery, but I think I'll have to use PHP for this. It sounds more server side.
You can target the iframe with jquery only:
<html>
<head>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#btnSubmit').click(function () {
var content = $("#test").val();
$('#iframe1').contents().find('p').html(content);
});
});
</script>
</head>
<body>
<textarea name="test" id="test" rows="5" cols="40"></textarea>
<button id="btnSubmit">Post to iFrame</button>
<iframe name="iframe1" id="iframe1" src="test2.html"></iframe>
</body>
</html>
Your iframe content page, in this case "test2.html" would have something like this:
<html>
<body>
<p>[intro text or whatever]</p>
</body>
</html>
Here is a previous S/O post with a similar issue: Selecting an element in iFrame jQuery
这篇关于JQuery将textarea的内容加载到IFrame中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
