我正在尝试拖放,这是我的代码:
$('.box-title').live('mousedown click', function(e)
{
var self = $(this);
var Box = self.parent('#box');
if(e.type == 'mousedown')
{
$(window).mousemove(function(e)
{
Box.css({ cursor: 'move', top: e.pageY - 15, left: e.pageX - 125 });
});
}
else if(e.type == 'click')
{
Box.css({ cursor: 'default', top: e.pageY - 15, left: e.pageX - 125 });
}
});
在鼠标按下时,它应该通过移动鼠标来启动拖动效果,之后,如果我想将框停靠/放置在我想要的位置,我单击它,它应该禁用移动,但如果我单击它,它不会不要停止移动 - 只是继续跟随我的鼠标。怎么才能停止拖拽呢?
您需要解绑mousemove
处理程序是still目前附上,例如:
function setPos(e) {
//can be $('#box') in this case...
$(this).parent('#box').css({ cursor: 'move', top: e.pageY - 15, left: e.pageX - 125 });
}
$('.box-title').live('mousedown click', function(e) {
if(e.type == 'mousedown') {
$(window).mousemove(setPos);
}
else if(e.type == 'click') {
$(window).unbind('mousemove', setPos);
}
});
或者,在 jQuery 1.4.3+ 中.live()
处理程序可以更干净一些:
$('.box-title').live({
mousedown: function() {
$(window).mousemove(setPos);
},
click: function() {
$(window).unbind('mousemove', setPos);
}
});
顺便说一句,它appears你有多个id="box"
页面中的元素...确保在这些情况下,在此代码中使用类$(this).parent('#box')
将会$(this).closest('.box')
反而。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)