AJAX 请求完成后，如何在按钮上设置 data-* 属性？

Question

这是

之前提出的问题的后续问题

老实说，我只是需要一个提示。我有 jquery 验证提交处理程序，它调用 ajax 查询。此查询 returns 一些数据，我希望在用户单击网页上的按钮时使用此数据。

现在，用户建议我不能在验证的提交处理程序中使用附加到按钮的点击挂钩。但是我怎样才能将数据传递到那里呢？

我的按钮在 html:

<a class="btn btn-default" data-transaction="" name="submitForm" id="submitForm" >Submit</a>

我现在在那里添加了一个data-transaction。在我的提交处理程序中，我正在做：

success: function(response) {
    var myNumber= (response[0].myNumber);
    $("#submitForm").attr('data-transaction', myNumber);
    alert(myNumber);

这让我想起了我的电话号码。但是当我在成功功能之外执行此操作时：

$("#submitForm").on('click', function()  {
    var number_id = $("submitForm").attr('data-transaction');
    alert("number: "+number_id );
    });                 
}

它打印我：number: undefined。那我怎么传递这个值呢？

Answer 1

使用 jquery data 代替：

$("#submitForm").data('transaction', transactionID);

和

var number_id = $("#submitForm").data('transaction');

请注意，这不会将属性添加到 DOM，如果您通过开发人员工具检查该元素，您将看不到 data-transaction，但该元素将引用数据.

编辑：

您的方法也应该有效，但正如@Tushar 指出的那样，您的选择器中缺少 #：$("submitForm") -> $("#submitForm")

AJAX 请求完成后，如何在按钮上设置 data-* 属性？

How can I set data-* attributes on the button when the AJAX requests complete?

javascript

jquery

jquery-validate