jquery - 从 iframe 层中的文本框位置获取内容

Question

我是 jquery 的新手，所以你的帮助/指南有点新。我有一个文本框，我在其中编写 html 标签。现在我想做的是一个预览按钮。它应该从我的文本框中打开一个带有书面 html 的 jquery 层/弹出窗口，以便我可以看到它。有没有办法让你们中的任何人指导我到哪里可以找到这样的脚本或帮助我一点？我已经搜索过这个，但我发现的只是如何使用外部资源打开 iframe。我需要将我自己的 html 传递到 iframe 中。

提前谢谢

Answer 1

这对我有用：

<link href="jquery-ui-1.7.2.custom.css" rel="stylesheet" type="text/css" />

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="ui.core.js" type="text/javascript"></script>
<script src="ui.dialog.js" type="text/javascript"></script>

<input type="submit" value="Submit" id="button" />
<input  type="text" id="txtBody" />
<br />

<div id="dialog" style="display: none;">
</div>

<script type="text/javascript">
    $("#button").click(function() {
        $("#dialog").html($("#txtBody").val());
        $("#dialog").dialog().dialog("open");
    });
</script>

实际上，我使用 .html() 是错误的。正确的方法是使用 .val()。

Answer 2

您真的有必要使用 iframe 或弹出窗口吗？还有其他解决方案，例如http://jqueryui.com/demos/dialog/，它们不会强制您拥有单独的 HTML 文档元素。或者您可以为此使用任何元素：

$("#target").html($("#source").html())

Answer 3

好的，假设您有一个带有 ID 的 textarea、一个带有 IDtxtBody的触发按钮button和一个带有 ID 的空 div，dialog它们将用于对话框。
然后你必须这样做：

<script type="text/javascript">
    $("#button").click(function() {
        $("#dialog").html($("#txtBody").html());
        $("#dialog").dialog();
    });
</script>

只是不要忘记在该页面中包含 jQuery 和 jQuery UI。