jquery / jqtouch getJSON调用导致无限循环?

时间:2010-08-06 13:03:51

标签: jquery ajax getjson jqtouch

编写我的第一个JQTouch应用程序。当我从#login转到#home时,JSON ajax调用成功发生,但pageAnimationEnded事件似乎处于无限循环中。

        $(function(){

            $('#login').ajaxComplete(function (e, xhr, settings) {                
                jQT.goTo('#home', 'flip'); 
            }); 

            $('#home').bind('pageAnimationEnd', function(e, info){

                alert('animation ended'); //infinite loop happens in here

                $.getJSON('/test', function(data) {
                     alert('json: ' + data); //this returns data successfully
                });

            });

        });

登录POST调用JQuery拦截并变成AJAX:

  <div id="login" class="current">
        <div class="toolbar">
            <h1>testapp</h1>
            <a class="button slideup" id="infoButton" href="#about">About</a>
        </div>
        <form:form commandName="user" action="/login/authenticate">
            <ul class="edit rounded">
                <li><form:input path="email"/></li>
                <li><form:password path="password" /></li>                    
                <li>Remember Me<span class="toggle"><input type="checkbox" /></span></li>                    
            </ul>
           <a style="margin:0 10px;color:rgba(0,0,0,.9)" href="" class="submit whiteButton">Login</a>
        </form:form>
    </div>

任何提示都将不胜感激,提前感谢! : - )

更新

显然.ajaxComplete也会收到其他元素的事件。我添加了一个警卫来过滤我想要的事件:

         $(document).ready(function(e){
              alert('document ready');

              $('#login').ajaxComplete(function (e, xhr, settings) {      

                  if(settings.url == '/login/authenticate') { //add check to prevent infinite loop
                      alert('jqt goto ' + settings.url);          
                      jQT.goTo('#home', 'flip'); 
                  }
             }); 

             $('#home').bind('pageAnimationEnd', function(e, info){

                alert('animation ended');

                $.getJSON('/test', function(data) {
                     alert('json: ' + data);
                });

             });
        });

2 个答案:

答案 0 :(得分:2)

雅这肯定会导致无限循环。假设初始pageAnimationEnd以某种方式被触发,这就是你正在做的事情:

动画结束,因此您的bind方法执行ajax调用。该ajax调用在完成ajaxComplete()上注册了一个回调,表示“回家”。这回家可能会做某种动画,完全触发你的ajax调用。该ajax调用在完成时ajaxComplete()注册了一个回调,表示“回家”......等等。

您可能想要的不是通用ajaxComplete(),它会在所有ajax请求上调用,而是在您的登录代码上执行单个调用的特定请求。我不确定你想要实现什么,所以很难给你解决问题的方法。如果我理解正确的话,这应该是对你的问题的充分解释

答案 1 :(得分:1)

我对JQuery不太满意,但我认为你可以使用$(selector).one(function(){...}来阻止循环。

http://api.jquery.com/one/