通過使用滑塊選項通過jQuery獲取值的值通過jQuery

Question

我有以下代碼滑塊選項。

<div class="time-filter"> 
     <div id="weekline"></div> 
     <div id="time-range"> 
      <p><span class="slider-time">10:00 AM</span> - <span class="slider-time2">12:00 PM</span> 

      </p> 
      <div class="sliders_step1"> 
       <div id="slider-range"></div> 
      </div> 
     </div> 
    </div> 

我需要在一定的時間間隔後得到「滑動時間」和「滑動時間2」跨度標記的改變值，例如，當span標籤中的時間發生變化時，我需要使用jQuery在3秒後從兩個span標籤中獲取更改的時間值。 我會怎麼做？

我曾嘗試下面的代碼：

<script language="javascript"> 
$(document).ready(function(e) { 
$(".slider-time").on("DOMSubtreeModified",function(){ 
    var timeHandler = setInterval(function(){ 
     alert($(".slider-time").html()+' x '+$(".slider-time2").html()); 
     },4000); 
     clearInterval(timeHandler); 
    }); 
}); 
</script> 

Answer 1

嘗試與此下面的代碼，它可以幫助你......

$('#time-range').on("DOMSubtreeModified propertychange", function() { 
 
var getSlidTime1 = $(".slider-time").html(); 
 
var getSlidTime2 = $(".slider-time2").html(); 
 
setInterval(function(){ alert(getSlidTime1+' - '+getSlidTime2); }, 3000); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
 
<div class="time-filter"> 
 
    <div id="weekline"></div> 
 
    <div id="time-range"> 
 
    <p><span class="slider-time">10:00 AM</span> - <span class="slider-time2">12:00 PM</span> 
 

 
    </p> 
 
    <div class="sliders_step1"> 
 
     <div id="slider-range"></div> 
 
    </div> 
 
    </div> 
 
</div>