的父母兄弟姐妹的div裏面的內容jQuery的變化值

Question

試圖範圍滑尺的值賦給滑塊父兄弟裏面

var rangeSlider = function() { 
 
    var slider = $('.range-slider'), 
 
     range = $('.range- 
 
     value = $('.range-slider__value'); 
 

 
     slider.each(function() { 
 

 
      value.each(function() { 
 
      var value = $(this).prev().attr('value'); 
 
      $(this).html(value); 
 
      }); 
 

 
      range.on('input', function() { 
 
      $(this).parents.siblings(value).html(this.value); 
 
      }); 
 
     }); 
 
     }; 
 

 
    rangeSlider();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
    <li> 
 
    <h3 class="range-slider__value">0</h3> 
 
    </li> 
 
</ul> 
 

 
<div class="range-slider"> 
 
    <input class="range-slider__range" type="range" value="100" min="0" max="500"> 
 
</div>

我加了一個codepen here

Answer 1

我改變你的codepen ，看看這個

var rangeSlider = function(){ 
     var slider = $('.range-slider'), 
      range = $('.range-slider__range'), 
      value = $('.range-slider__value'); 

     slider.each(function(){ 

     value.each(function(){ 
      var value = $(this).prev().attr('value'); 
      $(this).html(value); 
     }); 

     range.on('change', function(){ 
      $(this).parents().find(value).html(this.value); 
     }); 
     }); 
    }; 

    rangeSlider();