javascriptを使用して複数のフォームからクリックイベントをキャプチャする方法

Question

ページに0〜10のフォームがあります。それぞれのユーザーは、そのフォームのコンテンツに投票することができます。 JavaScriptを利用して、さまざまなフォームのクリックイベントをキャプチャし、コンテンツを特定のフォームのスコープに戻すにはどうすればよいですか。フォームのidを動的に生成する場合、javascriptでどのように記述すればよいですか？

Answer 1

jQuery JavaScriptライブラリを使用する場合は、同じ関数をすべてのフォームに1つの形式でアタッチし、コールバック関数内のフォームに参照を戻すことができます。あなたはこれを行うことができますAJAX要求を送信するために、ユーザによって提出するフォームを待っていた場合たとえば、次のように

// `$('form')` selects all the forms on the page 
// `.submit();` will call a function when the submit event is fired on all forms 
$('form').submit(function() { 
    // Store a reference to this form 
    var $thisForm = $(this); 

    $.ajax({ 
     ... 
     success: function() { 
      // do something with the $thisForm variable which is still in scope. 
     } 
    }); 
}); 

Answer 2

私はあなたが正確に何をしたいについての不確実です。

idsを生成するときにonclickイベントを割り当てる方法について説明します。

x.id = idname ; 
x.onclick = func(idname) 

次に、funcはidに基づいて何をすべきかを決定します。

Answer 3

質問から、イベントの委任が必要なようです。クリックイベントだけを話していると、それらはバブルアップするので、ハンドラに委譲するボディから単一のハンドラを使用できます。ただし、変更イベントは、あなたが、私は、クロスブラウザの問題を心配する必要はありませんので（IEでのキャプチャ段階でトラップにそれらをしようとせずに）

私はjqueryのを使用しますことをIEでバブルを行うことができませんでしませんそれ以外の場合、応答は10倍長くなります。 jqueryを使用できない場合は、クロスブラウザの狂気を見つけて実装する必要があります。ほとんどのフレームワークはまったく同じことをするユーティリティを持っています

<form id='dynamic-123' class='songs'> ---- </form> 
<form id='dynamic-681' class='events'> ---- </form> 

$(document.body).delegate("form", "click", function(e) { 
    // This handler will be called when a click is detected within any form. 
    // You'll have to use e.target to figure out which form it was. I would 
    // add class attributes to the forms that let you respond differently based on 
    // form was clicked. 
});