Question

对于项目，仅在触摸/移动滑块后才需要显示元素。我的JavaScript技能非常有限，我尝试了很多不同的方法，但从未奏效。

这是js小提琴的链接（test_id是一旦触摸/移动滑块便要显示的元素）： https://jsfiddle.net/dominikmeier/5r1Lnsyz/#&togetherjs=5B6pFpLVQ5

<div class="form-group required">
   <label class="col-form-label" for="id_kept">Slider:</label>
   <div class="controls  field-offer">
      <div class="input-group slider" data-slider>
          <input type="range" name="kept" value="-1" step="1" min="0" max="10" required id="id_kept" class="form-control" />
          <div class="input-group-append">
             <span class="input-group-text" data-slider-value title="current value" id="front_stagger_output_s" />
          </div>
      </div>
   </div>
</div>
<div class="test" id = "test_id">
   test
</div>

很抱歉“初学者”问题，但是我整天都在尝试，找不到答案。谢谢您的帮助！

Answer 1

您可以在范围滑块上尝试“ mouseup”事件：

/* On your js script */
var range_slider = document.getElementById("id_kept");

range_slider.addEventListener('mouseup', function() {
    if (this.value > 0) {
        //alert("Range Slider has value of " + this.value);
        document.getElementById("test_id").style.display = 'block';

    } else{
        //alert("Range Slider has value of " + this.value);
        document.getElementById("test_id").style.display = 'none';
    }
});

addEventListener到范围输入滑块以显示其他元素

1 个答案: