将值传递给模态

Question

我有一个 <table>，下面有一个 <td>，我正在打印不同的值，每个 <td> 上还有一个按钮。单击按钮后，我想将值传递给模式。这是我到目前为止得到的：

HTML:

<a data-toggle="modal" data-id="123" href="room.html#myModal">
    Check in
</a>
<div class="modal hide" id="myModal">
    <div class="modal-header">
        <button class="close" data-dismiss="modal">×</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        Room Number: <a name="roomnumber" id="roomnumber"></a>
    </div>
</div>

Javascript:

$(document).on("click", ".modal", function () {
    var roomNumber = $(this).data('id');
    $(".modal-body #roomnumber").val(roomNumber);
});

Fiddle.

Answer 1

您在 .modal 上附加了点击事件，但您没有为签入提供。要在锚标记中显示数据，您可以使用 .text()

<a data-toggle="modal" class="clickThis" data-id="123" href="room.html#myModal">
    Check in
</a>

和你的js代码：

$(document).on("click", ".clickThis", function () {
    var roomNumber = $(this).data('id');

    $(".modal-body #roomnumber").text(roomNumber);
});

demo

将值传递给模态

Passing a value to modal

jquery

modal-dialog