gpt4 book ai didi

javascript - bootstrap-datepicker 双插件和 stopPropagation

转载 作者:行者123 更新时间:2023-11-28 05:20:35 27 4
gpt4 key购买 nike

我使用 bootstrap-datepicker 并希望有第二个带有复选框的插件。当我单击复选框插件时,我不想触发日期选择器的显示。我测试了 stopPropagation,在第二个插件的 onclick 事件上返回 false,但它不起作用:(

<div class="container"> 
<div class ="form-group">
<label class="col-sm-2 control-label" >Received Date</label>
<div class="col-sm-2 input-group date" data-date-format="mm-dd-yyyy" id="ARDT">
<input class="text-input form-control" type="text" name="ARDT" maxlength="10" />
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
<span class="input-group-addon test"><input type="checkbox"/></span>
</div>
</div>
</div>

使用这个 JavaScript :

$(document).ready(function() {
$('#ARDT').datepicker();
$('.date .test').click(function(e){
e.stopPropagation();
});
});

您可以在此 jsfiddle 上观看直播:http://jsfiddle.net/5a5xzz10/4/

你能帮我吗?

谢谢虽然正确

编辑:找到解决方案:

  <div class ="form-group">
<label class="control-label" >Received Date OK</label>
<div class="input-group">
<div class="input-group date" data-date-format="mm-dd-yyyy" id="ARDT2">
<input class="text-input form-control" type="text" name="ARDT" maxlength="10" />
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
</div>
<span class="input-group-addon"><input type="checkbox"/></span>
</div>
</div>

将日期选择器的输入组嵌入另一个日期选择器中,并将第二个输入组插件放在后面

就像这里:http://jsfiddle.net/5a5xzz10/6

最佳答案

我有一个答案,但看起来不太优雅。

我在开始日期选择器生成后添加了复选框。

$(document).ready(function() {
$('#ARDT').datepicker();
$("div.date").append($('<span class="input-group-addon test"><input type="checkbox"/></span>'));
});

关于javascript - bootstrap-datepicker 双插件和 stopPropagation,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40590747/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com