Question

在我的 parent.htm 中有一个下拉列表，它使用 parent.js 中的JQuery函数updateMyList()从数据库动态填充

如果用户想要在列表中添加其他选项，则表单 child.htm 将加载到 parent.htm 的<div id="overlay">内。要插入新数据，将从 child.js 调用AJAX请求，该请求包含在 child.htm中。

如果请求成功，则从 child.js 通过$("#overlay").html("")卸载 child.htm 。发生这种情况时，我想致电parent.js updateMyList()，但我找不到触发它的方法。

在child.js内部使用opener没有用（TypeError：opener为null），我找不到一种方法来判断$("#overlay").html()是否已被更改回＆＃34;＆＃34;

任何帮助将不胜感激！很抱歉，如果这是一篇双重帖子，我的搜索字词已经用完了......

编辑：这是一个简化的代码：

parent.htm:

<head>
  <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
  <script type="text/javascript" src="parent.js"></script>
  <script>
  $(document).ready(function () {
    $('#new-option').click(function(){
        $("#overlay").load("child.htm");
    });     
  });
  </script>
</head>


parent.js:

$(document).ready(function(){

   function updateMyList(){
     //send AJAX and write options
   });

   // and do much more...
});


child.htm:

<head>
  <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
  <script type="text/javascript" src="js/child.js"></script>
</head>


child.js:

$(document).ready(function(){

  // do more stuff

  $('#save-option').click(function(){
     $.post("./inc/savenewoption.php", {
       //save user entries
     }, function(data){
            alert(data);
     })

     .done(function() {
            updateMyList(); // <- this won't work
            $("#overlay").html("");                 
     });
  });
});

Answer 1

它不起作用，因为updateMyList()位于不同的函数内（您的$(document).ready()个函数之一）。根据我的经验，将代码放入$(document).ready()函数的唯一原因是因为Javascript可以在文档完全加载之前触发。尝试在元素出现在文档之前触发它们会导致错误。

在ajax请求完成之前，updateMyList()函数不会触发，因此将其置于$(document).ready()之外应该是安全的。

JS / JQuery：如果child.html（）更改为＆＃34;＆＃34;则调用父项函数

1 个答案: