rangeslider.js mousedown 이벤트가 슬라이더 버튼에서 작동하지 않습니다.

Question

마우스 이벤트가 실행되지 않습니다. 슬라이더 값의 업데이트를 비활성화 할 수 있도록 보류 이벤트를 알 필요가 있습니다. 내 코드는

var sliding = false; 
function update_seek_value(value){ 
    if(!sliding){ 
      $("#replay-slider").val(value).change(); 
    } 
} 
$('.slider_button_class_name').on('mousedown',function(){ 
    sliding = true; 
}); 

Answer 1

$("#range-control").rangeslider({ 
 
    polyfill: false, 
 
    onSlideEnd: function(position, value){ 
 
     //console.log('Position', position, 'Value', value); 
 
     $("#selectedRange").text(value); 
 
    } 
 
});

body, input[type=text] { text-align: center; }

<link href="https://cdnjs.cloudflare.com/ajax/libs/rangeslider.js/1.2.1/rangeslider.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/rangeslider.js/1.2.1/rangeslider.min.js"></script> 
 
<input id="range-control" type="range" min="0" max="100" step="1" value="0"> 
 
<span id="selectedRange"></span>

이 도움이 희망입니다!

Answer 2

어쨌든 나는 이것에 대한 도움을 주셔서 감사합니다. 저는 혼자서 해결책을 찾았습니다. 이것은 비슷한 종류의 문제에 붙어있는 누군가를 도울 수 있기를 바랍니다. 솔루션은 JS 'rangeslider.min.js'

내 지식으로 하나 ('선택')를 $를 사용하여 중 하나 '이벤트'를 비활성화 할 수 있습니다. 오프 ("mousedown") 또는 이벤트 스톤 전파를을 stoping을 무시했다 . rangeslider.js.org에서 언급 한 '/yourlocalpath/rangeslider.js'를 사용하고 있습니다. mousedown 및 touchstart와 같은 이벤트에 대한 전파 이벤트를 중지하는 자바 스크립트 이벤트가 있지만 기본적으로 mousdown 이벤트를 수신하므로 내 stop event popogation 코드 바로 위에있는 플래그. 범위 플래그를 추가 한 rangeslider.js의 코드입니다.

j.prototype.handleDown = function(a) { 
console.log("mousedown event triggered"); // TRY TO FIND THIS LINE IN YOUR DOWNLOADED JS OF RANGESLIDER 
sliding = true;       // ADD YOUR MOUSEDOWN EVENTS HERE 
if (a.preventDefault(), this.$document.on(this.moveEvent, this.handleMove), this.$document.on(this.endEvent, this.handleEnd), !((" " + a.target.className + " ").replace(/[\n\t]/g, " ").indexOf(this.options.handleClass) > -1)) { 
    var b = this.getRelativePosition(a), 
    c = this.$range[0].getBoundingClientRect()[this.DIRECTION], 
    d = this.getPositionFromNode(this.$handle[0]) - c, 
    e = "vertical" === this.orientation ? this.maxHandlePos - (b - this.grabPos) : b - this.grabPos; 
    this.setPosition(e), b >= d && b < d + this.handleDimension && (this.grabPos = b - d) 
} 
}