我正在使用引导程序,并希望使用带有按钮的模式启动来确认用户删除操作。但是引导程序的示例代码似乎对我不起作用。因此,我从论坛上查找了一些示例,但仍然无法正常工作。我尝试过的一个例子就是从这里开始的。已经两个小时了,我仍然不知道我的代码有什么问题。“确认”按钮将不起作用,因此每当我单击“确认”按钮时,它都不会执行任何操作。当我将鼠标光标移到btn-ok上时,在浏览器中没有看到链接概述。
这是我的代码:
<button class="btn btn-default" data-href="delete.php?id=54" data-toggle="modal" data-target="#confirm">Delete</button>
<div class="modal fade" id="confirm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
...
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<a class="btn btn-danger btn-ok">Delete</a>
</div>
</div>
</div>
试试这个小提琴
https://jsfiddle.net/gildonei/pho9zp2f/9/
HTML代码
<a class="btn btn-default btn-delete" href="delete.php?id=54">Delete</a>
<div class="modal fade" id="my-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">...</div>
<div class="modal-body">...</div>
<div class="modal-footer">
<a id="bt-modal-cancel" href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
<a id="bt-modal-confirm" class="btn btn-danger btn-ok">Delete</a>
</div>
</div>
</div>
</div>
JavaScript代码
$(function(){
var $myModal = jQuery('#my-modal');
// Modal to delete record
var $btDelete = jQuery('.btn-delete');
if ($btDelete.length) {
$btDelete.click(function(e){
e.preventDefault();
var url = jQuery(this).attr('href');
var id = url.replace(/[^0-9]/g, '');
// Objects from alert modal
var $dsBody = $myModal.find('div.modal-body');
var $dsTitle = $myModal.find('div.modal-header h3');
var $btConfirm = jQuery('#bt-modal-confirm');
var $btCancel = jQuery('#bt-modal-cancel');
$dsBody.html('<p>Are you sure you want to delete the record #' + id + '?</p>');
$dsTitle.html('Delete Record');
$myModal.modal({
show: true
});
$btConfirm.attr('href', url).removeAttr('data-dismiss');
$btCancel.click(function(){
$dsTitle.html('Warning');
$dsBody.html('<p>Notice</p>');
$btConfirm.attr('href', '#').attr('data-dismiss', 'modal');
});
});
}
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句