0

我试图仅在 div 悬停但它不起作用时才显示 jscrollpane 可见性

这是代码

 $(document).ready(function(){ 
        $("#scroll").on("mouseenter", function(){
              $(this).jScrollPane();
        });

        $("#scroll").on("mouseleave", function(){
             var element = $(this).jScrollPane({});
             var api = element.data('jsp');
             api.destroy();
        });
 });



<td width="200">
        <div id="scroll" style="height:100px;overflow: auto;width: 100%;">
          <p>text -1</p>
          <p>text -2</p>
          <p>text -3</p>
          <p>text -N</p>
        </div>
</td>
4

1 回答 1

1

问题是当您破坏滚动窗格时。它将您的原始 div 替换为原始内容(参见代码段),因此注册的事件不再有效。您可以尝试使用事件委托。

来自 JScroll Pane 的片段,销毁方法:

        function destroy(){
            var currentY = contentPositionY(),
                currentX = contentPositionX();
            elem.removeClass('jspScrollable').unbind('.jsp');
            //See the below line
            elem.replaceWith(originalElement.append(pane.children()));
            originalElement.scrollTop(currentY);
            originalElement.scrollLeft(currentX);

            // clear reinitialize timer if active
            if (reinitialiseInterval) {
                clearInterval(reinitialiseInterval);
            }
        }

而且您不需要再次重新初始化它来破坏,而只需data('jsp')直接访问并调用破坏。

    $('table').on("mouseleave","#scroll", function(){ //Attach the event to the closest possible parent
       $(this).data('jsp').destroy();
    });

演示

于 2013-11-12T17:14:24.077 回答