2

jQuery Mobile にトグル スイッチ コンポーネントがあります (ここでは jsfiddle ) 。

<select name="toggle" id="toggle" data-role="slider">
    <option id="value1" value="off">value1</option>
    <option id="value2" value="on">value2</option>
</select>

表示されるテキストをいつでもプログラムで変更できるようにしたいと考えています。

たとえば、「value1」は「newvalue1」になり、「value2」は「newvalue2」になります。

この関数は、新しい値でトグル スイッチを再作成する必要がありますが、実際には何もしません。

function yourfunction() { 
    //alert ("Changing stuff");
    $('#value1').html ('newvalue1');
    $('#value2').html ('newvalue2');
    var myswitch = $("#toggle");
    myswitch.slider("refresh", true);
}
window.setInterval(yourfunction, 3000);​
4

2 に答える 2

2

Does this work for you?

JS

function yourfunction() { 
        //alert ("Changing stuff");
        $('.ui-slider-label-a').text('newvalue1');
        $('.ui-slider-label-b').text('newvalue2');
        var myswitch = $("#toggle");
        myswitch.slider("refresh", true);

    }
window.setInterval(yourfunction, 3000);​

jQM Adds a class for both options ( ui-slider-label-a and ui-slider-label-b ), by using these classes you can access the correct element and change the text.

NOTE: The best way to see the additional markup jQM adds is to use Google Chrome ( IMHO ) and inspect the element

于 2012-11-14T13:33:43.193 に答える
0

$('#value1').text('newvalue1');代わりに試してください$('#value1').html('newvalue1');

于 2012-11-14T10:49:52.867 に答える