我如何只有火災事件，如果flipswitch手動切換

Question

創建了一個jQuery Mobile的flipswitch這樣

<select id="flip" data-role="flipswitch"> 
    <option value="animal">Lion</option> 
    <option value="flower">Rose</option> 
</select> 

我聽這個flipswitch

$(document).on('change', '#flip', function(e) { 
    console.log('changed'); 
} 

的變化，但我不如果我改變翻轉開關的值，則要觸發事件

$('#flip').val('flower').flipswitch('refresh'); 

如何檢查翻轉開關通過直接與它進行交互或設置一個值並刷新翻轉開關，ch發生了變化？

我在this JSFiddle下創建了一個不需要的行爲示例。

Answer 1

您需要使用.on()附加change事件和.off()刪除它 - 再次綁定它之前 - 無論何時您動態更改值。

將所有代碼包裝在pagecreate事件中，它等於.ready()。

$(document).on("pagecreate", "#main", function() { 

    /* change event handler */ 
    function flipChanged(e) { 
     var id = this.id, 
      value = this.value; 
     console.log(id + " has been changed! " + value); 
    } 

    /* add listener - this will be removed once other buttons are clicked */ 
    $("#flip").on("change", flipChanged); 

    $('#setlion').on('vclick', function (e) { 
     $("#flip") 
      .off("change") /* remove previous listener */ 
      .val('animal') /* update value */ 
      .flipswitch('refresh') /* re-enhance switch */ 
      .on("change", flipChanged); /* add listener again */ 
    }); 

    $('#setrose').on('vclick', function (e) { 
     $("#flip") 
      .off("change") 
      .val('flower') 
      .flipswitch('refresh') 
      .on("change", flipChanged); 
    }); 
}); 

Demo