Bootstrap-下拉菜单在Datepicker中单击时关闭

DonOfDen 发表于 Dev

登·登

我正在使用Bootstrap和日期选择器。我在boostrap dowpdown中添加了一个日期选择器。选择日期时，下拉列表会自动关闭。请参阅图像以获取更多信息：

动作1：单击下拉按钮，我们将看到下拉列表。动作2：单击字段时。我将动态添加datepicker。动作3之后：选择日期时。下拉列表越来越近，因此用户返回到操作1。

我想做的是在用户单击日期之后。下拉菜单不应关闭。

我正在使用以下代码来防止单击在下拉列表中的表格上起作用的单击，而不是在日期选择器上起作用。

$(document).on('click', '.dropdown-menu', function(e) {
            if ($(this).hasClass('keep-open-on-click')) { e.stopPropagation(); }
        });

可以帮我防止下拉菜单关闭吗？

<div class="dropdown">
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true"><span class="icon16 icomoon-icon-bell"></span><span class="notification" id="notification_count">11</span>
                    </a>
  <ul class="dropdown-menu keep-open-on-click">
    <li><a href="#">HTML</a></li>
    <li><a href="#">CSS</a></li>
    <li><a href="#">JavaScript</a></li>
  </ul>
</div>

注意：当用户单击表上的日期以结束日期时，将自动添加日期选择器。那是问题吗？

登·登

我无法解决此问题，因此我将解决方案从下拉菜单更改为Modal。

<div class="dropdown">
  <a href="#" data-toggle="modal" data-target="#NModal"><span class="icon16 icomoon-icon-bell"></span><span class="notification" id="notification_count">11</span>
                    </a>
<div id="NModal" class="modal fade" role="dialog" style="min-width: 650px;">
<div class="modal-dialog">
<!-- My Code -->
</div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。