javascript - 使用 Backbone 验证表单

Question

如何验证从 View 到模型的表单？

我只想检查电子邮件和密码是否至少包含 6 个字符。如果为真，则启用该按钮，如果不是，则抛出一条消息。

HTML

<form>
    <input type="text" name="email" placeholder="Type your email here." />
    <input type="password" name="password" placeholder="Type your password here." />
    <button disabled>Log In</button>
</form>

JavaScript

var User = new Backbone.Model.extend({
});

var AppView = Backbone.View.extend({
    el: $('form'),
    events: {
        'keyup input[name=email]': 'validationScope'
    },
    initialize: function() {
        this.render();
    },
    validationScope: function() {
        console.log('testing');
        // What to do here?
    }
});

var appView = new AppView();

要玩，就去做 right here .

Answer 1

只需检查估算字符的长度是否至少为 6。

例如

validationScope: function(e) {
        console.log('testing');
        // What to do here?
        var email = e.currentTarget.value;

        this.$el.find('button').prop('disabled', !(email.length >= 6));

    }

或者在你的情况下，因为你希望电子邮件和密码都至少有 6 个字符

 events: {
        'keyup input[name=email]': 'validationScope',
        'keyup input[name=password]': 'validationScope'
    },
    initialize: function() {
        this.render();
    },
    validationScope: function() {
        console.log('testing');
        // What to do here?
        var email = this.$el.find('input[name=email]').val();
        var password = this.$el.find('input[name=password]').val();

        var disable = (email.length < 6 || password.length < 6);

        this.$el.find('button').prop('disabled',disable);

    }

这是对您的 fiddle 的更新