Javascript 什么关闭了模式?
我使用的是twitter bootsrap模式。它包含“保存”、“取消”按钮和用于关闭的箭头。当模式被箭头和按钮关闭时,如何处理(并识别)案例Javascript 什么关闭了模式?,javascript,jquery,twitter-bootstrap,Javascript,Jquery,Twitter Bootstrap,我使用的是twitter bootsrap模式。它包含“保存”、“取消”按钮和用于关闭的箭头。当模式被箭头和按钮关闭时,如何处理(并识别)案例 $("#myModal).on('hidden.bs.modal', function () { // ??? Arrow or button is the initiator }); 当使用数据开关关闭模式时,无法跟踪事件,如数据解除=“模式” 尝试使用每个事件上的事件来解决问题。您需要挂接按钮/图标,单击自己并从javascript
$("#myModal).on('hidden.bs.modal', function () {
// ??? Arrow or button is the initiator
});
当使用
数据开关关闭模式时,无法跟踪事件,如数据解除=“模式”
尝试使用每个事件上的事件来解决问题。您需要挂接按钮/图标,单击自己并从javascript中取消模式。以下是一个例子:
$(function () {
var myModal = $("#myModal");
$("#btnShow").on("click", function () {
myModal.modal("show");
});
myModal.find(".closeIcon").on("click", function () {
console.log("Close Icon clicked.");
myModal.trigger("myModal.dismiss.closeIcon");
myModal.modal("hide");
}).end().find(".closeButton").on("click", function () {
console.log("Close Button clicked.");
myModal.trigger("myModal.dismiss.closeButton");
myModal.modal("hide");
}).end().find(".saveButton").on("click", function () {
console.log("Save Button clicked.");
myModal.trigger("myModal.dismiss.saveButton");
myModal.modal("hide");
});
myModal.on("myModal.dismiss.closeIcon", function () {
console.log("Close Icon Handler called.");
}).on("myModal.dismiss.closeButton", function () {
console.log("Close Button Handler called.");
}).on("myModal.dismiss.saveButton", function () {
console.log("Save Button Handler called.");
});
});
基本模式HTML(添加了closeIcon、closeButton和saveButton类,以便能够分派事件)
显示模式
&时代;
情态标题
一个好身体&hellip
接近
保存更改
.删除这些按钮上的引导数据切换,然后对它们应用事件以区分。rry,我对您的答案投了反对票,因为我理解了您的意思:您不能使用数据,但仍然可以使用单击事件处理程序。如果你编辑了你的答案,我可以再次投上一票——目前,我的投票被锁定,因为我投下了一票。
<button id="btnShow">Show Modal</button>
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close closeIcon" aria-hidden="true">×</button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default closeButton" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary saveButton">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->