javascript - 使用 jQuery 从子弹出窗口动态填充父窗口上的选择选项

Question

我正在尝试使用从子(弹出)表单调用的 ajax 调用返回的数据填充父窗口上选择元素的选项。子窗体通过 window.open 从父窗体调用。

奇怪的是删除选择选项是有效的；这成功了:

$('#selElement', opener.document).find('option').remove().end();

但如下所示附加，抛出 SCRIPT5022:抛出异常但未捕获。

$('#selElement', opener.document).append($("<option />").val('').text('---Select---'));

我也试过

$('#selElement', opener.window.document).append($("<option />").val('').text('---Select---'));

代码如下:

// the line below works; it removes all of the options from the drop-down
$('#selElement', opener.document).find('option').remove().end();

// the ajax call below returns the right data       
$.ajax({
    url: 'actions.cfc?method=getOptions&returnFormat=json',
    dataType: 'json',
    // the value being sent here just limits the options returned in the results
    data: {myType: $('#myType').val()},
    async:false,
    success: function(response) {
        // getting the right data back
        console.log(response);
        // the line below results in SCRIPT5022: Exception thrown and not caught
        $('#selElement', opener.document).append($("<option />").val('').text('---Select---'));
        // never get this far unless I comment out the line above; then the error is thrown here    
        for (var i = 0; i < response.DATA.length; i++) {    
            $('#selElement', opener.document).append($("<option />").val(response.DATA[i][0]).text(response.DATA[i][1]));   
        }       
    },
    error: function (response) {
        var r = jQuery.parseJSON(response.responseText);
        alert("Message: " + r.Message);
    }
});

有什么想法吗？

Answer 1

如果你想在另一个文档中创建元素，你必须像在目标中一样在创建时指定它:

$('#selElement', opener.document).append($("<option />", opener.document).val('').text('---Select---'));
//Specify the document where the element will be created ^ 

否则该元素将在子文档中创建，并且当代码尝试将其添加到父文档时将抛出错误。

此外，您还可以简化选项的创建:

$("<option value=''>---Select---</option>", opener.document)