jqm滑塊停止事件沒有觸發

我正在嘗試構建一個JQM頁面，其中顯示/隱藏基於滑塊位置的txt框的切換/翻轉滑塊。請參閱JSfiddle test page。jqm滑塊停止事件沒有觸發

HTML -

<div data-role="page"> 
<div data-role="header" data-theme="b"> 
    <label>JQM Slider Toggle test</label> 
</div> 
<div data-role="container"> 
    <div data-role="fieldcontain"> 
     <label for="OnFront">Device Location:</label> 
     <select name="OnFront" id="OnFront" data-role="slider" data-theme="b"> 
      <option value="true">Front</option> 
      <option value="false">Rear</option> 
     </select> 
    </div> 
    <div id="DeviceOnFront"> 
     <div data-role="fieldcontain"> 
      <label for="FrontPosId">Front Position</label> 
      <input type="text" id="FrontPosId" class="input_txt"></input> 
     </div> 
    </div> 
    <div id="DeviceOnRear" hidden="hidden"> 
     <div data-role="fieldcontain"> 
      <label for="RearPosId">Rear Position</label> 
      <input type="text" id="RearPosId" class="input_txt"></input> 
     </div> 
    </div> 
</div> 
<div data-role="footer" data-theme="b"> 
    <label>Glyn Lewis</label> 
</div>

JS -

$('div[data-role="page"]').bind('pageinit', function() { 

// debug test to see if events are firing ??? 
$("#OnFront").on("start", function() { 
    alert("User has started sliding my-slider!"); 
}); 

$("#OnFront").on("stop", function (event) { 
    var value = event.target.value; 
    alert("User has finished sliding my slider, its value is: " + value); 
}); 

// code for changing which txt box is shown 
// based on toggle/flip switch 
$("#OnFront").on("stop", function (event) { 
    var value = event.target.value; 
    if (value == true) { 
     $("#DeviceOnFront").show(); 
     $("#DeviceOnRear").hide(); 
    } else { 
     $("#DeviceOnFront").hide(); 
     $("#DeviceOnRear").show(); 
    }; 
});

};

我無法讓滑塊「停止」事件觸發？

任何指針都會被感激地接受。

來源

2013-03-17 user1909266

下面是從你的例子做了一個有效的解決方案：http://jsfiddle.net/Gajotres/AWyXq/

你有幾個錯誤的。活動sliderstop和sliderstart不存在：

$("#OnFront").on("sliderstart", function() { 
    alert("User has started sliding my-slider!"); 
});

的正確名稱是slidestart和slidestop：

$('#OnFront').on('slidestart', function(){  
    console.log('Start'); 
});

來源

2013-03-17 21:02:09 Gajotres

魔術，您的幫助和指導，非常感謝......我也注意到你改變了「pageinit」爲$（document）.on（'pagebeforeshow'，...你能解釋一下原因嗎？ – user1909266 2013-03-19 01:38:43

小提琴能正常工作，但是我的代碼仍然有問題。我的代碼，我在日誌中看到它，但是元素不會跳轉？第一次通過正確的翻轉發生，但之後，屏幕不更新即使JavaScript被擊中??? – user1909266 2013-03-19 02:08:51

剛剛創建簡單的HTML頁面與小提琴的代碼，這也正常工作。必須與網站的其他部分有關...這是我試圖用JQM「mobalise」的MVC4 web應用程序。在這個網站上的事件發生，javascript被擊中，但頁面上的元素只更新過一次？有沒有人見過這種行爲？因爲我此時正在學習任何幫助或指示請 – user1909266 2013-03-19 02:26:57

jqm滑塊停止事件沒有觸發

回答

相關問題