获取打开模式的按钮(不使用数据-* html 标记)



>我有一个引导模式,通过两个不同的按钮单击打开。 如果满足给定的 Instatnce 条件:

$('#buttonName').on('click', function (e) {
var arg = something;
if (condition) {
$('#modalName').modal('show');
} else { someFunction(arg); }
});
$('#otherButton').on('click', function (e) {
var arg = something;
if (condition) {
$('#modalName').modal('show');
} else { someFunction(arg); }
});

此处不能使用 HTML 数据属性。所以像这样:

<button id="buttonName" class="modalBtn" data-toggle="modal" data-target="#modalName" data-caller="button1"></button>

将不起作用,因为如果on.click事件中的语句被省略并且模态是打开的,无论条件如何,我都不想要。

模式包含一个按钮

<div id="logoutBoxModal" class="modal fade bd-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" data-backdrop="true" keyboard:="true">
<div id="" class="modal-content">                   
<button id="modalButton"></button>
</div>
</div>

这应该根据两个按钮中的哪一个打开它来做一些事情。

我试过这个:

//$('#myModal') alternatively
$('.modal').on('show.bs.modal', function (e) {
var $trigger = e.relatedTarget;
console.log($trigger);
});

但它总是返回未定义

我能找到的所有答案都涉及数据属性的使用,不能在这里使用。

总而言之,我所需要的只是如何将值传递给模态,以便它可以告诉按钮它应该做什么,并且所有这些都必须使用 javascript/jquery 完成。

谢谢

更新 - 答案

返回$trigger变量是 Javascript 而不是 jQuery,它的数据可以用 Javascript 访问:

<button id="buttonName" class="modalBtn" data-caller="button1"></button>
var $trigger = e.relatedTarget.target;
var data = $trigger.dataset.caller;
console.log(data);

与jQuery相反:

...
var data = $trigger.data("caller");
console.log(data);

当你调用$('#modalName').modal('show');时,传递第二个参数。

例:

$('#modalName').modal('show', {target: e.target});

e.relatedTarget现在应该是目标分配给e.target的对象(或您选择传递的任何对象(。

编辑(每条评论(:

$('#buttonName').on('click', function (e) {
var arg = something;
if (condition) {
// Pass target in click-event handler
$('#modalName').modal('show', {target: e.target});
} else {
someFunction(arg);
}
});
$('.modal').on('show.bs.modal', function (e) {
var $trigger = e.relatedTarget.target;
console.log($trigger);
});