通过jQuery从带有滑块选项的span标签获取值

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>

我需要在一定的时间间隔后得到“slider-time”和“slider-time2”span标签的更改值，例如：当span标签中的时间发生变化时，我需要在3秒后使用jQuery从两个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>