为什么DIV在IE中使用Crossrider& amp; JQueryUI? &安培;没有阻止停止事件?

时间:2013-03-14 14:59:55

标签: jquery-ui internet-explorer jquery-ui-draggable crossrider

我正在使用Crossrider,我想在页面的DOM中添加一个可拖动的div。
以下代码适用于Chrome和Firefox,并且针对Chrome和Firefox触发了dragstop处理函数,没有任何问题。
但对于IE来说,div可以拖动一次!一旦div被删除,它就不能被再次拖动,更奇怪的是在IE中根本没有触发dragstop事件处理程序!?

如何在IE中修复此问题?

以下是代码:

extension.js文件

appAPI.ready(function(jQuery) {              
    appAPI.resources.jQueryUI('1.10.1'); 
    appAPI.resources.includeCSS('styles.css');
    var $div = jQuery('<div class="square" ></div>').appendTo('body');
    $div.draggable( {containment: "window", scroll: false} );
    $div.bind('dragstop', function() {
        console.log("drag stopped ..."); 
    }); 
});

styles.css文件

.square {
    display:block; 
    z-index: 1000001; 
    background-color: #000000; 
    height: 100px; 
    width: 100px;
    top: 0px;
    left: 0px;
    position: fixed;
}

请注意,我尝试了没有交叉驾驶员的代码,我在IE上运行它,效果很好。
您可以使用以下链接进行尝试:http://jsfiddle.net/GHaMV/

2 个答案:

答案 0 :(得分:2)

我使用Crossrider遇到了同样的问题并设法通过声明一个返回可拖动元素的处理函数来解决问题,因此您的代码应该如下所示:

$div.draggable({
      containment: window,
      helper: function() {
          return $div;
      }
});

希望它有所帮助...

答案 1 :(得分:0)

没有dragstop事件,只有stop挂钩(see the docs):

使用它like this

$div.draggable({
    containment: "window",
    scroll: false,
    stop: function() {
        console.log("drag stopped ..."); 
    }
});