Question

我正在动态使用Bootstrap的模态背景，并且遇到滞后问题。场景是我有一个显示从服务器检索的信息的div。当我双击该div时，它会增长，变为模态并向我显示有关该元素的更多详细信息。随着时间的推移，滞后变得越来越大，当我检查chrome dev工具时，似乎我的Bootstrap背景进来（虽然我看不到它），然后几秒钟之后它会实际显示信息。

以下是带有jsFiddle链接的代码：

<div id="container">
    <div class="rect">Double Click Me!</div>
</div>

<div id='mask' class='modal fade'>
    <div class="modal-container"> </div>     
</div> 

$('.rect').dblclick(function()
{
    var clonedElem = $('.modal-container');

    clonedElem.css({'width' : '35%', 'height' : '90%'});
    clonedElem.offset({left : ($(window).width()/3) });

    clonedElem.html(function()
    {
        var html = '<h4>Big Rectangle</h4>';
        return html;    
    });

    $('#mask').modal();
});

链接是http://jsfiddle.net/ukL48/1/，但我无法重现该问题。我想小提琴和项目之间的主要区别在于我不会从小提琴上的服务器中抓取任何东西。有任何想法吗？

Answer 1

原来这不是Bootstrap模态代码的错误，而是双击。很多人都知道双击会干扰单击，但是我的代码没有明确地使用该元素的单击事件。 '.rect'元素使用拖动（jQuery）事件，这无意中意味着使用单击。我不得不使用一个库进行长按，直到找到导致这两个事件不发生冲突的东西。

为什么Bootstrap模态背景滞后？

1 个答案: