我创建了一个拖动条，它会在拖动时增加和减少容器宽度，在单击时它会收缩/展开。但每当我试图拖动它时，单击事件都会触发，拖动条会收缩。我使用的是backbone.js和下面的代码。
events: {
'click .sideNavBar': 'toggleHeadersSection',
'mousedown #dragBar': 'increaseDragBarWidth',
'mouseup #dragBar': 'decreaseDragBarWidth',
'click #dragBar': 'toggleHeadersSection',
},
increaseDragBarWidth: function (event){
$(document).mousemove(function(event){
$('.clinical-data-accordion').css("width",event.pageX+2);
});
},
decreaseDragBarWidth: function (event){
$(document).unbind('mousemove');
},
toggleHeadersSection: function(event){
let clinicalDetailSection = this.$el.find("#clinicalDetailSection");
let isHidden = $(clinicalDetailSection).hasClass('isHidden');
this.displayHeadersSection(isHidden);
},
1条答案
按热度按时间ljsrvy3e1#
这是一个JSFiddle，其中有一些图像可以拖动和单击。（它是纯js）
通过检查鼠标按下和向上事件的时间差，可以区分单击和拖动。
如果您按住鼠标超过150毫秒，则不计为单击。如果您将该检查添加到单击事件中，则它应该起作用。