twitter bootstrap modal - 如何将数据传递给回调函数

时间:2012-08-06 02:21:59

标签: javascript twitter-bootstrap modal-dialog

有没有办法将其他数据传递给bootstrap模态函数回调?

例如,假设我的链接导致模态打开,其中有一个额外的属性,里面有一些有用的数据,我怎么能引用那个attr?

HTML

<span listid="80" href="#editTaskList" data-toggle="modal" class="btn btn-mini right"><i class="icon-edit"></i> Edit Task List</span>

JS

$('#editTaskList').on('show', function () {
    // get the source of the click, and then get the data i need.
});

3 个答案:

答案 0 :(得分:3)

这对你有用吗?

<span listid="80" href="#editTaskList" data-toggle="datamodal" class="btn btn-mini right"><i class="icon-edit"></i> Edit Task List</span>
var $editTaskList = $('#editTaskList');

$('body').on('click.modal.data-api', '[data-toggle="datamodal"]', function (e) {
    var $this = $(this);
    $editTaskList.data('anyAttr',$this.data('anyAttr'));
    $editTaskList.modal('show');
    e.preventDefault();
})

$editTaskList.on('show', function () {
    var myData = $editTaskList.data('anyAttr');
});

答案 1 :(得分:1)

喜欢这个 -

<span id="modal_opener" data-extrastuff="stuff" listid="80" href="#editTaskList" data-toggle="modal" class="btn btn-mini right"><i class="icon-edit"></i> Edit Task List</span>

$('#modal_opener').click(function() {
    var stuff_i_want = $(this).attr('data-extrastuff');
});

答案 2 :(得分:1)

我知道这是一个老问题,但这是我在谷歌上发现的第一件事。所以,我想在这里提供一些重要信息......

您需要在调用模态之前将回调函数绑定到事件上,例如:

$('#modal').on('shown', function(){ 
     // Do something when the modal is loaded
});
$("#modal").modal();

这非常重要,对我帮助很大,所以,这里是......