jquery - jQuery Mobile-滑块的值始终为零

我正在尝试获取动态生成的滑块的值。不幸的是，无论我做什么，它们始终返回“ 0”或null值。我不知道这个...

这是我正在使用的HTML代码：

<input type="number" data-type="range" class="init_slider ui-input-text ui-body-b
ui-corner-all ui-shadow-inset ui-slider-input" name="init_slider_0" id="init_slider_0"
min="-5" max="30" />

   <div role="application" class="ui-slider-track ui-btn-down-b ui-btn-corner-all">

      <a href="#" class="ui-slider-handle ui-btn ui-btn-up-b ui-shadow ui-btn-corner-all"
data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span"
data-theme="b" role="slider" aria-valuemin="-5" aria-valuemax="30" aria-valuenow="14"
aria-valuetext="14" title="14" aria-labelledby="init_slider_label_0" style="left:
54.285714285714285%;"><span class="ui-btn-inner"><span class="ui-btn-text"></span></span></a>
   </div>

和我的JS（可能效率不高，但是我只是想让它起作用）：

$('[data-role="page"]').live('pageshow', function () {
 $(".init_slider").change(function() {
    var init_data = {};
    $.each(".init_slider_label", function(index, option) {
        char_name = $("#init_slider_label_"+index).text();
        var init_val_desc = $("#init_slider_"+index).next();
        var init_val_foo = $(init_val_desc).children("a")[0];
        var init_foo = $(init_val_foo);
        var init_val = $(init_foo).attr('aria-valuenow');
        init_data[char_name] = init_val;
     });
   });
});

根据我要尝试的内容，init_val的值始终总是以“ 0”结尾或什么都没有。

我也不认为该问题是特定于滑块的，因为当我将其更改为简单文本字段时，我遇到了相同的问题：始终返回值“ 0”。因此，我想知道这是否与我如何调用此代码有关。正如您在上面的示例中看到的那样，我正在使用“ pageshow”进行此操作。但是单击按钮后我也遇到同样的问题。

有人对我有什么建议吗？

谢谢！

最佳答案

对于动态注入的项目，应该以这种方式绑定事件。

$(document).on("change", ".init_slider", function() {
 var slider_val = $(this).val();
 console.log(slider_val);
});

Demo

关于jquery - jQuery Mobile-滑块的值始终为零，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19796480/