4

在提交表单后的以下代码中,我需要留在同一页面上,所以我说我的目标是 iframe。

但是在我得到回复后,我需要填充一个文本区域,我该怎么做。下面的代码有什么问题?

<script>
    //After I get a response
    $("#result").html("This is your result"); //Textarea not populated
</script>

<form  method="POST" enctype="multipart/form-data" id="contentform" action="/dg/execute_model/" target="upload_target" onsubmit="return validate();">{% csrf_token %}
    <b>
        <table class="cat-tab" cellspacing="0" cellpadding="0" border="0">
            <tr>
                <td><font>*</font>Test data</td>
                <td><input type="file" name="test_file" id="test_file" /></td>
            </tr>
            <tr>
                <td></td>
                <td><input type="submit" value="Build" id="addbtn" /></td>
            </tr>
        </table>
</form>

<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;">
    <b><br>Result:<br><br></b>
    <textarea rows="20" cols="100" name="result" id="result" ></textarea>
</iframe>
4

3 回答 3

2

为什么查询$('#result')在您的示例中不起作用

默认情况下,jQuery 查询当前document对象的 DOM 树。由于iframe元素实际上嵌入了带有单独window对象的单独document对象,因此 textarea 根本不在您当前查询的范围内,因此找不到。

如何$('#result')正确查询

这意味着为了遍历嵌入的 DOM,iframe我们首先需要访问 iframewindowdocument对象。一种安全且跨浏览器的方法是使用 iframe 的window属性访问iframe .contentWindow,然后访问..documentwindow

例如:

var target_document = $('#upload_target')[0].contentWindow.document;
var target_result   = $(target_document).find('#result');
target_result.val('This is your result');
于 2013-02-18T23:00:19.623 回答
1

这对我有用:

$( "#result", $("#upload_target").contents() ).val("This is your result.");
于 2013-02-18T22:17:16.883 回答
1

尝试这个 :-

$('#upload_target').contents().find('#result').html('This is your result'); 
于 2013-02-18T11:40:12.613 回答