3

編集用のフォームが付いたモーダルボックスをポップアップする編集ボタンを作成しています。次に、jQueryがこのフォームをサーバーに送信すると、JSON応答が返されます。ただし、バブリングの問題により、たとえば、すべての編集ボタンをクリックしてから最後のボタンをクリックしてフィールドを変更すると、すべてのボタンで処理が行われます。

$('.edit').click(function(event){
 //more code...
    modal_submit(the_id);
    event.stopPropagation();
});

次に、送信イベント：

function modal_submit(the_id){
$('#modal form').submit(function(){
    //This will alert every time I have EVER clicked on an edit button
    alert(the_id);
    return false;
});

}

最後に、これはすべてgetScriptの内部にあります。

$.getScript('js/edit.js',function(){
create_edit_btn();

}）;

私はこれを1回だけ使用しましたが、機能しましたが、this.event.stopPropagationも実行する必要がありましたが、「this」を実行すると、this.eventは未定義と表示されますが、前述のように、この正確なコード私がやった別のスクリプトのために前に働いた。

誰かアイデアはありますか？：\

編集：

the html is: 
<li> 
  <input id="item1" type="checkbox" value="webhosting|15" title="Web Hosting">  
    <p>Hosting for your web site</p>
</li>
4

3 に答える 3

3

イベントには、複数のイベントリスナーを含めることができます。$（element）.submit（whateverFunction）を使用するたびに、送信イベントに別のwhateverFunctionを追加します。最後のリスナーのみをイベントの呼び出し時に実行されるアクションにしたい場合は、次のようにしてみてください。

function modal_submit(the_id){

$('#modal form').unbind(); // this will remove all other event listeners from this element

$('#modal form').submit(function(){
        //This will alert every time I have EVER clicked on an edit button
        alert(the_id);
        return false;
});
于 2009-07-25T02:05:16.930 に答える
2

event.stoppropagationはすでにその仕事をしていると思います。ボタンのクリックイベントでのすべてのバブリングが停止しました（つまり、ドキュメントの本文を確認しようとすると、マウスクリックイベントが発生しなくなります）。フォームの送信内のコードが引き続き実行される理由は、これがボタンのデフォルトのアクションによって呼び出されるためです。

event.stoppropagation（）と一緒に、これを含めることをお勧めします。

event.preventDefault();

デフォルトのアクションが使用されず、ハンドラー内のコードのみが実行されるようにします。

于 2009-07-25T02:04:08.447 に答える
0

これは編集ボタンを作成する機能にありますか？

$('.edit').click(function(event){
 //more code...
        modal_submit(the_id);
        event.stopPropagation();
});

この場合、このハンドラーが同じ要素に複数回追加され、アラートが急増します。を使用liveします。これにより、実行後にisが追加された場合でも、一致したすべての要素にハンドラーが配置されます。

于 2009-07-25T01:51:40.833 に答える