カスタムデータをJQueryのクリックイベントに送信するにはどうすればよいですか？

Question

私はイベントを、このjQueryのをクリックしています：{：「Hello World」のキー}

jq("#generateButton").click({key: "hello world"}, function() { 
      console.dir(this);// this is the "generateButton" html element. 
     // jq(this) would be the jquery object of the generate button 
      frnConstr.setDataObject(this); 
     frnConstr.gameObject.state.start(frnConstr.EnteriorScreen.KEY); 
    }); 

は、どのように私はおそらく例のプリントのために、このイベントにカスタムデータを送ることができますか？ それはすべて可能ですか？

注：私のカスタム作成環境では、jq（）は$（）またはjquery（）です。

注：jQueryのドキュメントはEVENTDATAは何でもできることを言い、ここで公式のドキュメントです： https://api.jquery.com/click/ :)

Answer 1

通常は、あなたがに送信されevent.dataを参照している。このため、データ属性を使用して

<button id="generateButton" data-custom="hello world"> 

を使用して

jq("#generateButton").on("click",function() { 
    var custom = $(this).data("custom"); 
}); 

でそれをつかむだろうバインド時間

jq("#generateButton").on("click",{"what":"hello"}, function(event) { 
    var custom = $(this).data("custom"); 
    console.log(event.data.what+" "+custom); // hello world 
}); 

<button id="generateButton" data-custom="world"> 

---

例

$(function() { 
 
    $("#generateButton1").on("click", function() { 
 
    var custom = $(this).data("custom"); 
 
    console.log(custom); 
 
    }); 
 

 

 
    $("#generateButton2").on("click", { 
 
    what: "goodbye" 
 
    }, function(event) { // needed here 
 
    var custom = $(this).data("custom"); 
 
    console.log(event.data.what + " " + custom); // hello world 
 
    }); 
 

 
    $("#generateButton3").on("click", function() { 
 
    var formdata = $(this).closest("form").serialize(); 
 
    console.log(formdata); 
 
    }); 
 
    
 
    
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<button type="button" id="generateButton1" data-custom="hello world">Hello world</button> 
 

 
<button type="button" id="generateButton2" data-custom="world">Goodbye world</button> 
 
<hr/> 
 
Serializing: 
 
<form> 
 
    <input type="text" name="field1" value="f1" /><br/> 
 
    <input type="text" name="field2" value="f2" /><br/> 
 
    <button type="button" id="generateButton3">Click to serialize</button> 
 
</form>

Answer 2

することはできませんが、方法は、周りのあなたのhtml内のデータの属性を持っており、上のその属性を取得することですその要素をクリックします。

例：

<button id="generateButton" data-key="something"/> 

jq("#generateButton").click(function() { 
    console.log($(this).data('key')); // something 
    ..... 
}); 

Answer 3

まず、あなたが参照jQueryのバージョン1.4.3以上であることを確認してください。

jq("#generateButton").click({key: "hello world"}, function (event) { 
    var key=event.data.key; 
    //do something with the key value 
}); 

このeventDataシグネチャで渡されるすべてのデータは、event.dataオブジェクトからアクセスできます。