2013-05-16 38 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”方法的特殊行为吗?我在文档中找不到任何东西... –