javascript - 在主干验证后防止页面重新加载

Question

我有这样的看法：

 return Backbone.Marionette.ItemView.extend({ 
    template: template,

    ui: {
      form: '#login',
      button: '#submitbutton'
    },

    onRender: function() {
      this.ui.form.on('submit', function(e) {

        // e.preventDefault();

        mylogin = new login();

        mylogin.save({boxid:$("#boxid").val(),password:$("#passwordid").val(),validate:true});

             vent.trigger('navigate', 'home');

        // if(myLogin.validationError) {
        //     vent.trigger('navigate', 'home');
        // }

        return false;
      });
    }
  });

这个模型：

return Backbone.Model.extend({



  validate: function(attrs, options){
    if(attrs.boxid.length < 10)
      {
        return "user id must be more than 10 characters";
        // return "BoxID should be greater than 10";
      }
   else if(attrs.password.length < 10)
      { 
         return "password must be more than 10 characters";
        // return "Password should be greater than 10";
      }
   else if((attrs.boxid!=myBoxid)||(attrs.password!=myPassword))
      {
          return "Your login credentials are incorrect";  
      }

  },





   });

这个登录 html 模板：

<div class>
    <div>Information</div>
    <div>
        <form id="login" name="login" method="post">  
            <div>
                <label for="boxid">BoxID</label>  
                <input id="boxid" name="box" placeholder="Enter your box ID">
            </div>
            <div>
                <label for="password">Password</label>  
                <input id="passwordid" type="password" name="password" placeholder="Password">
            </div>
            <label id="errormsg"></label>
            <button id="submitbutton">Login</button>
        </form>  
    </div>
</div>

问题是每次用户输入错误的凭据时页面都会重新加载，有什么办法可以防止这种情况发生吗？

Answer 1

要完成这项工作，您应该退后e.preventDefault();一步。

更重要的是模型没有url功能http://backbonejs.org/#Model-url

return Backbone.Model.extend({
    url: function () {
        // see the docs, it can be a url string or a function
    }
    validate: function(attrs, options){
    },
});