Question

我的页面上有一些不同的模态需要传递给它们的数据。我用this other question解决了这个问题，我现在使用jQuery并且非常有帮助。这就是我现在所拥有的：

$(document).on("click", ".edit", function () {
    $(".modal-body #value").val($('.edit').data('id'));
});

我的问题是，由于我的页面动态创建了按钮（来自基于模型的foreach），无论我点击哪个按钮，都会从第一个按钮获取值。如何从单击的按钮获取值。

我考虑给他们所有单独的ID，但我不想为每个id创建一个函数。我读到这个.on方法有一个数据属性，但我找不到如何使用它的好例子，以及它是否适用于我的情况。

如果有人有任何建议，我将非常感激。谢谢！

Answer 1

$(document).on("click", ".edit", function () {
    // Use $(this) to reference the clicked button
    $(".modal-body #value").val($(this).data('id')); 
});

Answer 2

您可以使用this关键字引用被点击的按钮。请尝试以下方法：

$(document).on("click", ".edit", function () {
    $(".modal-body #value").val($(this).data('id'));
});

Answer 3

使用Bootstrap的事件：

$('#your-modal').on('show.bs.modal', function (e) {
    var btn = $(e.relatedTarget);
    var id = btn.data('id');
    $("#value").val(id);
});

参见＆＃34;活动＆＃34; http://getbootstrap.com/javascript/#modals的部分：

[show.bs.modal事件]在调用show实例方法时立即触发。如果由单击引起，则单击的元素可用作事件的relatedTarget属性。

从动态按钮将特定值传递给模态

3 个答案: