javascript - 将对象传递给 jquery 函数

Question

如果有 jQuery 代码

var info = $("#info");

for (var i = 0; i < 3; i++) {
  $("p").eq(i).on("click", function(event) {
    var reply = [
      " message=message for first p",
      "index = " + $(this).index(),


    ];
    info.append(reply.join(", ") + "<br>");
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p> 0 </p>
<p> 1 </p>
<p> 2 </p>
<div id="info"></div>

在回复数组中，我需要根据函数中动态给出的参数值为每个 p 添加自定义消息。我如何在 jquery 中实现它？我对此知之甚少data 属性可以使用，但不清楚。

更新:我需要一个对象来存储 on() 方法中的值。

Answer 1

如果您可以使用 data 属性，只需将消息存储在 data 属性(如 data-message)上，然后使用jQueryElement.attr('data-message') 或 jQueryElemenet.data('message') 像这样:

var info = $("#info");

for (var i = 0; i < 3; i++) {
  $("p").eq(i).on("click", function(event) {
    var message = $(this).data("message"); // get the data-message of this p
    info.append(message + "<br>");         // use it ...
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p data-message="hey this is the first"> 0 </p>
<p data-message="and this is 2"> 1 </p>
<p data-message="this will be the THIRD"> 2 </p>
<div id="info"></div>