2013-05-16 65 views
2

我有一個事件處理程序,它應該在selectbox(id =「save-login」)的值發生變化後調用。選擇框顯示爲滑塊,因此我使用「slidestop」事件。該頁面有一個登錄按鈕,用於向同一個URL位置提交一個公式。提交表單後,相同的頁面將再次顯示。jQuery Mobile事件處理程序不總是工作

不幸的是,第一次提交後,當selectbox值發生變化時,將不再調用事件處理函數。如果我再次提交表單,處理程序將經常再次運行。

這是我的網頁的代碼和用於將事件處理程序綁定腳本:

<!DOCTYPE HTML> 
<HTML> 
    <head>  
     <link rel="stylesheet" href="jquery.mobile.structure-1.0.1.CSS" /> 
     <link rel="stylesheet" href="jquery.mobile-1.3.0.CSS" /> 

     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery.mobile-1.3.0.min.js"></script> 
    </head> 
    <body> 
     <div data-role="page" id="login" data-theme="c">   
      <div data-role="content"> 
       <div id="loginform"> 
        <form action="login_test.html" method="post" data-transition="flip"> 
         <ul data-role="listview" data-inset="true" data-theme="c"> 
          <li> 
           <label for="save-login">Login-Informationen speichern</label> 
           <select name="save-login" id="save-login" data-role="slider"> 
            <option value="0">Nein</option> 
            <option value="1">Ja</option> 
           </select>      
          </li> 
         </ul>   
         <input type="submit" value="Login" data-role="button"> 
        </form> 
       </div> 
      </div> 

     <script type="text/javascript"> 
     $(":jqmData(role='page')").on("pageshow", function(event) { 
      var selectbox = $("#save-login"); 
      selectbox.on("slidestop", function(event, ui) { 
       if (this.value == "1") { 
        alert("Autologin enabled"); 
       } 
      }); 
     }); 
     </script>   

     </div> 
    </body> 
</HTML> 

有誰知道是什麼原因造成的事件處理程序無法正常工作的想法?

+0

你爲什麼將其綁定到'pageshow'?將其刪除,因爲只有在「pageshow」事件觸發時纔會起作用。 – Omar

+1

每次頁面加載時都會觸發pageshow事件。這似乎按預期工作,即使找到了選擇框對象並添加了處理程序。 –

回答

1

你的代碼改成這樣:

$(document).off("pageshow", ":jqmData(role='page')").on("pageshow", ":jqmData(role='page')" ,function(event) { 
    $(document).on("slidestop", "#save-login",function(event, ui) { 
     if (this.value == "1") { 
      alert("Autologin enabled"); 
     } 
    }); 
}); 
+0

感謝您的提示!用「on」和選擇器參數綁定事件處理程序的確有竅門。我只是好奇,爲什麼它沒有選擇元素沒有工作。但是... –

+0

因爲你每次回頁面時都使用pageshow,所以yoz再次綁定click事件。這就是爲什麼我在再次應用之前使用過去除click事件的原因。第二次點擊事件總是否定第一次。基本上,當您始終可以使用委託事件查找時,您是否將事件綁定到文檔,並且會找到更正元素的方法。 – Gajotres

+0

你寫過「第二次點擊事件總是否定第一次點擊事件」,你是什麼意思?這是「on」方法的特殊行爲嗎?我在文檔中找不到任何東西... –