twitter-bootstrap – 如何动态更改bootstrap模态数据 – 目标点

发布时间：2020-12-17 20:42:17 所属栏目：安全来源：网络整理

导读：我有一个网站日历,其行为类似于预订请求. 我有这个在Bootstrap 2x工作,但已将应用程序转换为3.0.一切似乎都有效,但我想弄清楚如何动态更改数据目标. 如果日期可用,则日历中的某一天可能如下所示： div id="20140226" data-id="20140226" class="NotRequested

我有一个网站日历,其行为类似于预订请求.
我有这个在Bootstrap 2x工作,但已将应用程序转换为3.0.一切似乎都有效,但我想弄清楚如何动态更改数据目标.

如果日期可用,则日历中的某一天可能如下所示：

<div id="20140226" data-id="20140226" class="NotRequested calDay" data-target="#modalDialog1" data-toggle="modal">26</div>

我有一个show事件,它拉出了day div的id并设置了请求div的id,它工作正常.

$('#modalDialog1').on('show.bs.modal',function (e) { 
    $(e.target).data("id",$(e.relatedTarget).data("id"));
}

在此模式中,按钮发送日期请求,如果成功,则交换div的类以显示已请求日期.

这是我的问题：
在Bootstrap 2x中,我将取消绑定click事件,并重新绑定到新的click事件.

在Bootstrap 3x中,我试图更改数据目标.

dateElement.data("target","#modalDialog2");

当我再次点击这个日期时,我得到了初始请求对话框“#modalDialog1”而不是#modalDialog2

我也尝试保留bind / unbind代码,但是,看起来我需要删除模态数据切换,因为现在它在请求日期后显示两个对话框.

我显然错过了一些东西.

如何动态更改数据目标以便调用第二个对话框？

解决方法

我知道这是旧的,所以我希望这一切都是正确的.

我相信我通过从请求modalDialog1获取id获取上面的日期元素来解决这个问题.

如果请求成功,则会更改css和click事件.

var dateElement = $("#" + $("#modalDialog1").data("id"));
dateElement.removeClass("NotReceived");
dateElement.unbind('click');

然后设置新的CSS和目标

dateElement.addClass("Requested");
dateElement("target","#modalDialog2");

然后将click事件绑定到新函数以显示dialog2

dateElement.bind('click',PromptDialog2Function);

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!