0

我遇到了一个很奇怪的问题！

我写了以下代码：

<script type="text/javascript" src="jquery-1.8.3.min.js"></script>

<textarea id="code">
    <div id="hello">Hello world!</div>
    <script type="text/javascript">
    $(function(){
        $("#hello").css({"border":"solid 3px red"});
        alert($("#hello").size());
    });
    </script>
</textarea>

<iframe src="iframe.html"></iframe>

<script type="text/javascript">
    $(function(){
        $("iframe").on("load",function(){
            $(this).contents().find("body").append($("#code").val());
        });
    });
</script>

“iframe.html”文件仅包含对 jQuery 库的调用。

结果是“Hello world！” 显示在 iframe 中但没有红色边框！似乎这$("#hello")行不通。事实上，如果我这样做alert($("#hello").size())，我会得到“0”。

你有什么主意吗？谢谢！

编辑：添加“警报”。

4

2 回答 2

0

$(this).contents().find("body").append($("#code").val()); 仅获取当前值，因此它可能不会复制与其链接的任何 css 值。 http://api.jquery.com/val/

我建议首先在 1 个文件中对其进行测试，看看它做了什么，所以现在删除 iframe 部分并检查 1 个文件上的 .size() 。这样你就知道 .val 和 .size() 在你的#hello 上的行为了。

试试这个作为下面的脚本：

<script type="text/javascript">
$(function(){
$("iframe").on("load",function(){
alert($("#code").val());
    var scriptx = $("#code").val();
    $(this).contents().find("body")[0].innerHTML = scriptx;
        });
    });
</script>
    });
</script>
于 2013-04-20T17:38:36.090 回答
0

我认为html格式是错误的。如果您放置一些 html 元素，那么您将div放在文本区域内部和任何文本区域内部，那么这些元素将被简单地视为一些文本，并且 html 元素不会在浏览器中呈现。因此，您可以将 div 元素放在文本区域之外。

<textarea id="code"></textarea>
<div id="hello">Hello world!</div>

我希望这会奏效.. :)

于 2013-04-20T17:34:55.817 回答