Question

我正在开发基于HTML5＆amp; amp ;;的移动应用程序。 CSS＆amp; JS，由jQuery mobile提供支持。

我正在以编程方式创建表单。我使用文本字段和游侠（滑块）。创建此输入后，它们没有样式。没问题。为了刷新文本字段样式，我使用：

$(selector).textinput();

..并且一切正常（当然只适用于input =“text”）。

但是如果我想刷新一个滑块（游侠），我会用它：

$(selector).slider("refresh");

我得到一个错误：

未捕获错误：在初始化之前无法调用滑块上的方法;试图调用方法'刷新'

确定。如果我改变了这个：

$(selector).slider();

如果工作50％：看：http://postimg.org/image/8upkakkc1/ ..

=============================================== ====================

我的代码：

HTML：

<div data-role="page" id="newclass_step4_complete" data-title="newclass_step4_complete">
        <div data-role="content" style="background-color:#fff;">
                <form>
                    <ul data-role="listview" data-inset="true" id="zdup_ul">
                        <li><br><span style="font-size:50px;color:#FFA500;margin-top:50px;" id="compl_name"></span><hr></li>

                        <li id="dupa_ultimu">
                            <hr>
                            <div class="ui-grid-a">
                                <div class="ui-block-a"><button type="button" id="discardvalcrits" data-inline='true'><i class='lIcon fa fa-chevron-left'></i>Înapoi</button></div>
                                <div class="ui-block-b"><button type="button" id="btn_save_ok_vals" data-inline='false' style="color:green;"><i class='lIcon fa fa-check'></i> Salveaza</button></div>
                            </div>
                        </li>
                    </ul>
                </form>
        </div>
    </div>

JS：

$(document).on("click", ".comp_var_btn", function(event){                    

                var idus = $(this).attr("compvar");

                $("#compl_name").html(lista_variante[idus]);

                var biguscontent = "";
                $.each( lista_criterii, function( crit_id, crit_vals ) {
                    if(crit_vals['evaluare'] == "valmare_avmare")
                        biguscontent = biguscontent + '<li data-role="fieldcontain" id="cu_del_aici_'+crit_id+'"><label for="cmpvar_'+crit_id+'">'+crit_vals['nume']+':</label><input type="text" id="cmpvar_'+crit_id+'" value="" data-clear-btn="true" placeholder="Valoarea mare .. avantaj mare"></li>';
                    else if(crit_vals['evaluare'] == "valmic_avmare")
                        biguscontent = biguscontent + '<li data-role="fieldcontain" id="cu_del_aici_'+crit_id+'"><label for="cmpvar_'+crit_id+'">'+crit_vals['nume']+':</label><input type="text" id="cmpvar_'+crit_id+'" value="" data-clear-btn="true" placeholder="Valoarea mica .. avantaj mare"></li>';
                    else
                        biguscontent = biguscontent + '<li data-role="fieldcontain" id="cu_del_aici_'+crit_id+'"><label for="cmpvar_'+crit_id+'">'+crit_vals['nume']+':</label><input type="range" id="cmpvar_'+crit_id+'" value="5" min="1" max="10" data-highlight="true"></li>';                


                });
                $("#dupa_ultimu").before(biguscontent);

                window.location = "#newclass_step4_complete";

                if(prima_data_tata == 1){
                   // works ok
                    $('#zdup_ul').listview('refresh');
                    $.each( lista_criterii, function( crit_id, crit_vals ) {
                        if(crit_vals['evaluare'] == "valmare_avmare" || crit_vals['evaluare'] == "valmic_avmare"){
                             // works ok
                            $("#cmpvar_"+crit_id).textinput();
                        }
                        else{
                            // HERE BIG FAIL

                            //$("#cmpvar_"+crit_id).slider( "value", 6 );
                            //$("#cmpvar_"+crit_id).slider();
                            //$("#slider").slider('value',9);
                            $("#cmpvar_"+crit_id).slider("refresh");
                            //$("#cmpvar_"+crit_id).remove();
                        }
                    });
                } else prima_data_tata = 1;

            });

所以..？：（

Answer 1

为了刷新输入类型范围，您只需要覆盖其值

你可以这样做：

$('input[type="range"]').val(newVal);

但是这可能不适用于您的代码，因为您正在从JS生成这些输入

所以。首先，您需要采用'biguscontent'并将其分解为多个变量，其中一个是范围输入

你最终会得到像这样的东西

var rangeInput = <input type="range" value="" min="" max="" />
var biguscontent = '<li>..' + rangeInput + '...</li>...';

然后您将能够单独定位输入并更改其值

$(rangeInput).val(newVal)

在这里，您可以在点击http://jsfiddle.net/wpa5rqc7/

上看到范围输入'刷新'的小提琴

jQuery Mobile游侠/滑块刷新无效

1 个答案: