Question

我正在尝试创建一个Bootstrap模式以便快速购物。单击按钮时，我添加了一个小的超时功能，让模态在出现之前加载所有内容。只是为了自己。单击普通普通div /元素内的按钮时，这非常有效。

我遇到的问题是，当单击动态创建的div /元素内的按钮时，它不起作用。我有一个旋转木马（猫头鹰 - 旋转木马），里面有几个项目，每个项目都有一个快速的商店按钮。单击此按钮时，模式会弹出，但会跳过加载部分。所以会发生这样的情况：当打开一个模态并关闭它然后打开下一个模态时，将显示第一个模态中的内容，并在几秒钟后显示新模态的内容。

单击动态创建的元素/ div /按钮时，似乎会跳过脚本的加载部分。

我拥有的是：

// dynamic created items inside owl-carousel//
<div class="item">
<a data-toggle="modal" data-target="#quick-shop-modal" data-vid="12384069" data-handle="12384069.html">Quick shop</a>
</div>

// the modal //
    <div id="loader"></div>
      <div aria-hidden="false" role="dialog" tabindex="-1" id="quick-shop-modal" class="modal fade" data-show="false">
    .....
    </div>

// The script //
     $(document).ready(function(){
          $(document).on('click', '.quickview', function(e){
            e.preventDefault();
            $('#loader').show();
            var url = $(this).data('handle') + '/?format=json';
            var vid = $(this).data('vid');
            var $target = $($(this).data('target'));

            // it looks like this part is skipped
            $target.data('triggered',true);
            setTimeout(function() {
              if ($target.data('triggered')) {
                quick_shop(url, vid);
              };
                }, 1000);
              return false;
            });
          });

有谁知道代码出了什么问题？

Answer 1

考虑使用回调函数而不是固定的超时持续时间。

按钮单击动态创建元素时的BS模态超时

1 个答案: