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行ずつ実行すると、動作が少し異なります。

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

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

私の質問は、コンソールを介して手動で1行ずつ実行しないとなぜ機能しないのか、そしてどうすれば修正できるのかということだと思います。

4

2 に答える 2

0

問題は、newtaskが親ウィンドウで定義されており、子ウィンドウからアクセスできるとは思わないため、タスクの追加ページにjavascriptイベントをプリロードするのが最善の解決策です。イベントは少し異なります：

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

このコードスニペットは、タスクの追加ページにすでに含まれている必要があります。これがお役に立てば幸いです。

于 2013-03-16T19:19:11.973 に答える
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 に答える