jQuery多窗口访问和处理程序

jQuery Multi Window Access and Handlers

本文关键字:处理 程序 访问 窗口 jQuery      更新时间:2023-09-26

我正在开发一个非常依赖jQuery的web应用程序。我有一个结构为:

的select语句
<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检查器,逐行运行以下代码,它的行为会略有不同:

1. var newWin = window.open("/projects/new");
2. $("form", newWin.document).submit(function(){
      newWin.close();
   });

我想我的问题是为什么它不工作,除非我手动运行它一行一行通过控制台,我怎么解决这个问题?

问题是newtask是在父窗口中定义的,我不认为你可以从子窗口访问它,所以最好的解决方案是在add-task页面中预加载javascript事件。事件将略有不同:

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

此代码片段应该已经包含在添加任务页面中。

我明白了。当我试图附加事件处理程序时,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();

实际工作。