Ползунковый тумблер внутри JQuery Collabsible

Question

Я пытаюсь поместить JQuery тумблер (слайдер) внутри складной. Кнопка появляется внутри сворачиваемого объекта, как и предполагалось, но я не могу получить ее состояние в своем коде JavaScript. Кажется, переключатель невидим для моего кода JS. Это то, чем я занимаюсь:

HTML:

<div data-role="fieldcontain">
                   <label for="flipmin">Switch:</label>
                   <select id="switch" data-role="slider">
                                 <option value="0">Off</option>
                                 <option value="1">On</option>
                   </select>
        </div>

JavaScript:

$(document).on('pageinit','#page1',function(){
$("#lightswitch").change(function() {
    var args = $("#lightswitch option:selected").val();
    console.log(args);
}); });

Любой совет? Спасибо!

Answer 1

Хм это сделал это:

$(document).ready(function(){
 console.log("asd");
$(".fieldcontainer").change(function() {
    var args = $(".fieldcontainer option:selected").val();
    console.log(args);
}); });

<div data-role="fieldcontain" class="fieldcontainer">
                   <label for="flipmin">Switch:</label>
                   <select id="switch" data-role="slider">
                                 <option value="0">Off</option>
                                 <option value="1">On</option>
                   </select>
        </div>

никогда не видел что-то вроде

$(document).on('pageinit','#page1',function()

до сих пор, что это делает?