0

我正在开发一个相当依赖 jQuery 的 Web 应用程序。我有一个结构如下的选择：

<select id='task_id'>
    <option value=''>Select</option>
    <option value='0001'>First Task</option>
    <option value='0002'>Second Task</option>
    <option value='addnew'>Add New...</option>
</select>

而且我还有一些 jQuery，当有人选择“添加新...”时会打开一个新窗口，这样他们就可以在另一个页面上输入详细信息。

var newTask;
$("select").change(function(){
    if( $(this).val() == "addnew" ){        
       if( newTask )
          newTask.close();
       newTask = window.open( "/projects/add-task", "newTask", "width=990,height=600" );
    } else {
       if(newTask)
          newTask.close();
    }

我想从父窗口添加一个事件处理程序到子窗口上的表单提交按钮，这样当有人提交表单（即他们完成添加）时，窗口将关闭。我所拥有的是：

    $("form", newTask.document).submit(function(){
       newTask.close();
    });
});

就其本身而言，它不起作用，但它不会引发任何错误。如果我打开 Chrome Inspector 并逐行运行以下命令，它的行为会略有不同：

1. var newWin = window.open("/projects/new");

2. $("form", newWin.document).submit(function(){
      newWin.close();
   });

我想我的问题是为什么它不起作用，除非我通过控制台逐行手动运行它，我该如何解决？

4

2 回答 2

0

我已经想通了。当我尝试附加事件处理程序时，DOM 没有完全加载是一个问题。

if(newTask)
   newTask.onload = function(){
     $("input[type=submit]", newTask.document).click(function(){
        newTask.close();
     });
   };

下一个问题是我将如何“jQuery-ify”它？我不喜欢使用“el.onload”，但我似乎无法做出任何变化

$(newTask.document).ready();

或者

$(document, newTask).ready();

实际工作。

于 2013-03-16T19:28:46.443 回答
0

问题是 newtask 是在父窗口中定义的，我认为您不能从子窗口访问它，因此最好的解决方案是在添加任务页面中预加载您的 javascript 事件。事件会略有不同：

$('#form').submit(function(){
    window.close();
});

此代码段应该已经包含在您的添加任务页面中。我希望这是有用的。

于 2013-03-16T19:19:11.973 回答