echo "<a href=\"delete.php?id=$result[exportid]\"><button type='button' class='btn btn-danger btn-xs glyphicon glyphicon-remove-circle'></button></a>";
上面的按钮加载delete.php
当用户点击按钮时,我想显示是/否窗口。如果用户单击是,则需要加载delete.php(带有id信息)。单击否时,需要加载其他php文件。
这是一个很好的方法吗?我尝试过使用JavaScript但无法使用它。
答案 0 :(得分:0)
1st无需在链接中添加按钮,只需设置链接样式:
echo "<a href=\"delete.php?id=$result[exportid]\" class='btn btn-danger btn-xs glyphicon glyphicon-remove-circle delete-button'></a>";
然后在javascript(jquery)中附加按钮点击事件并显示确认信息:
$(function(){
$('a.delete-button').click(ev){
ev.preventDefault();
var deleteUrl = $(this).attr('href');
var otherUrl = 'some other url';
if(confirm('Are you sure you want to delete this item')){
window.location = deleteUrl;
}else{
window.location = otherUrl;
}
}
});
答案 1 :(得分:0)
您可以轻松地进行如下确认对话:
<!-- Modal dialog -->
<div class="modal fade" id="myForm" tabindex="-1">
<!-- CUTTED -->
<div id="step1" class="modal-footer">
<button type="button" class="glyphicon glyphicon-erase btn btn-default" id="btnDelete"> Delete</button>
</div>
</div>
<!-- Modal confirm -->
<div class="modal" id="confirmModal" style="display: none; z-index: 1050;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body" id="confirmMessage">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="confirmOk">Ok</button>
<button type="button" class="btn btn-default" id="confirmCancel">Cancel</button>
</div>
</div>
</div>
</div>
档案.js:
$('#btnDelete').on('click', function(e){
confirmDialog(YOUR_MESSAGE_STRING_CONST, function(){
//My code to delete
});
});
function confirmDialog(message, onConfirm){
var fClose = function(){
modal.modal("hide");
};
var modal = $("#confirmModal");
modal.modal("show");
$("#confirmMessage").empty().append(message);
$("#confirmOk").one('click', onConfirm);
$("#confirmOk").one('click', fClose);
$("#confirmCancel").one("click", fClose);
}
使用one
代替on
可以防止在下一次打开对话框时调用删除功能。
我希望这可能有所帮助。
按照完整的文字示例:
var YOUR_MESSAGE_STRING_CONST = "Your confirm message?";
$('#btnDelete').on('click', function(e){
confirmDialog(YOUR_MESSAGE_STRING_CONST, function(){
//My code on OK click
});
});
function confirmDialog(message, onConfirm){
var fClose = function(){
modal.modal("hide");
};
var modal = $("#confirmModal");
modal.modal("show");
$("#confirmMessage").empty().append(message);
$("#confirmOk").one('click', onConfirm);
$("#confirmOk").one('click', fClose);
$("#confirmCancel").one("click", fClose);
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<!-- Modal dialog -->
<div id="frmTest" tabindex="-1">
<!-- CUTTED -->
<div id="step1" class="modal-footer">
<button type="button" class="glyphicon glyphicon-erase btn btn-default" id="btnDelete"> Delete</button>
</div>
</div>
<!-- Modal confirm -->
<div class="modal" id="confirmModal" style="display: none; z-index: 1050;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-body" id="confirmMessage">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" id="confirmOk">Ok</button>
<button type="button" class="btn btn-default" id="confirmCancel">Cancel</button>
</div>
</div>
</div>
</div>
&#13;