Backbone.js Backbone.modelBinder-无法在'；按键'；

我在应用程序中使用Backbone.ModelBinder。我想将事件侦听器添加到我的姓名字段上的

keyup

。我试过这样做

$().ready(function () {

    dogs = new Backbone.Collection({model:Backbone.Model});

    var nameConverter = function(direction, value){
       console.log(direction, value); //on keyup nothing consoles.
        return value;
    }



    var phoneConverter = function (direction, value) {

        if (direction === Backbone.ModelBinder.Constants.ModelToView) {
            var formattedPhone = '';
            if (value) {
                formattedPhone = value.replace(/[^0-9]/g, '');

                if (formattedPhone.length == 7) {
                    formattedPhone = formattedPhone.substring(0, 3) + '-' + formattedPhone.substring(3, 7);
                }
                else if (formattedPhone.length == 10) {
                    formattedPhone = '(' + formattedPhone.substring(0, 3) + ') ' + formattedPhone.substring(3, 6) + '-' + formattedPhone.substring(6, 10);
                }
                else if (formattedPhone.length == 11 && formattedPhone[0] === '1') {
                    formattedPhone = '1 (' + formattedPhone.substring(1, 4) + ') ' + formattedPhone.substring(4, 7) + '-' + formattedPhone.substring(7, 11);
                }
            }

            return formattedPhone;
        }
        else {
            return value.replace(/[^0-9]/g, '');
        }
    };


    model = new Backbone.Model({firstName:'Bob', graduated:'maybe', phone: '1234567'});

    model.bind('change', function () {
        $('#modelData').html(JSON.stringify(model.toJSON()));
    });

    model.trigger('keyup'); // just to show the #modelData values initially, not needed for the ModelBinder


    ViewClass = Backbone.View.extend({

        _modelBinder:undefined,

        initialize:function () {
            this._modelBinder = new Backbone.ModelBinder();

        },

        render:function () {
            var html = '\
Edit your information:<br><br>\
First Name: <input type="text" name="firstName"/><br>\
Last Name: <input type="text" name="lastName"/><br>\
Phone: <input type="text" name="phone"/><br>\
Height: <input type="text" name="height"/><br><br>\
\
Graduated: Yes: <input type="radio" id="graduated_yes" name="graduated" value="yes">\
No: <input type="radio" id="graduated_no" name="graduated" value="no">\
Maybe: <input type="radio" id="graduated_maybe" name="graduated" value="maybe"><br>\
\
Eye Color: Green: <input type="radio" name="eyeColor" value="green">\
Blue: <input type="radio" name="eyeColor" value="blue">\
Brown: <input type="radio" name="eyeColor" value="brown"><br><br>\
\
Drivers licence: <input type="checkbox" name="driversLicense"/><br>\
Motorcycle license: <input type="checkbox" name="motorcycle_license" /><br><br>\
Dog: \
<select name="dog">\
<option value="">Please Select</option>\
<option value="1">Andy</option>\
<option value="2">Biff</option>\
<option value="3">Candy</option>\
</select> <br><br>\
Big Text:<br> <textarea name="bigText" rows="4" cols="80"></textarea>\
';

            this.$el.html(html);

            var bindings = {
                firstName: {selector:'[name=firstName]',converter:nameConverter},
                lastName: '[name=lastName]',
                driversLicense:'[name=driversLicense]',
                motorcycle_license:'[name=motorcycle_license]',
                graduated:'[name=graduated]',
                eyeColor:'[name=eyeColor]',
                phone:{selector:'[name=phone]', converter:phoneConverter},
                dog:{selector:'[name=dog]', converter:(new Backbone.ModelBinder.CollectionConverter(dogs)).convert},
                bigText:'[name=bigText]'
            };

            //this._modelBinder.bind(this.model, this.el, bindings);
            this._modelBinder.bind(this.model, this.el, bindings, {changeTriggers: {'': 'change', '[name=firstName]': 'keyup'}});
            return this;
        }
    });

    view = new ViewClass({model:model});
    $('#viewContent').append(view.render().el);
});

$（）.ready（函数（）{
dogs=新主干.Collection（{model:Backbone.model}）；
变量名称转换器=功能（方向、值）{
console.log（方向，值）；//在无键控制台上。
返回值；
}
var phoneConverter=功能（方向、值）{
if（direction==Backbone.ModelBinder.Constants.ModelToView）{
var formattedPhone=''；
如果（值）{
formattedPhone=value.replace（/[^0-9]/g'）；
if（formattedPhone.length==7）{
formattedPhone=formattedPhone.substring（0,3）+'-'+formattedPhone.substring（3,7）；
}
else if（formattedPhone.length==10）{
formattedPhone='（'+formattedPhone.substring（0,3）+'+formattedPhone.substring（3,6）+'-'+formattedPhone.substring（6,10）；
}
else if（formattedPhone.length==11&&formattedPhone[0]==='1'）{
formattedPhone='1（'+formattedPhone.substring（1,4）+'+formattedPhone.substring（4,7）+'-'+formattedPhone.substring（7,11）；
}
}
返回格式化电话；
}
否则{
返回值。替换（/[^0-9]/g'，）；
}
};
model=新主干网。model（{名字：'Bob'，毕业：'maybe'，电话：'1234567'}）；
model.bind（'change'，function（）{
$（'#modelData'）.html（JSON.stringify（model.toJSON（））；
});
model.trigger（'keyup'）；//只是最初显示#modelData值，ModelBinder不需要
ViewClass=Backbone.View.extend({
_modelBinder:未定义，
初始化：函数（）{
这是._modelBinder=new Backbone.modelBinder（）；
},
渲染：函数（）{
var html='1〕\
编辑您的信息：

\
名字：
\
姓氏：
\
电话：
\
高度：

\
\
毕业生：是的：\
否:\
也许：
\
\
眼睛颜色：绿色：\
蓝色：\
棕色：

\
\
驾驶执照：
\
摩托车牌照：

\
狗：\
\
请选择\
安迪\
比夫\
糖果\


\
大文本：
\
';
这个.$el.html（html）；
变量绑定={
名字：{选择器：'[name=firstName]'，转换器：nameConverter}，
lastName:“[name=lastName]”，
driversLicense:“[name=driversLicense]”，
摩托车许可证：“[name=摩托车许可证]”，
分级：“[name=graded]”，
eyeColor:“[name=eyeColor]”，
电话：{选择器：'[name=phone]'，转换器：phoneConverter}，
狗：{选择器：'[name=dog]'，转换器：（new-Backbone.ModelBinder.CollectionConverter（狗））.convert}，
bigText:“[name=bigText]”
};
//this._modelBinder.bind（this.model，this.el，bindings）；
this._modelBinder.bind（this.model，this.el，bindings，{changeTriggers:{''：'change'，'[name=firstName]'：'keyup'}）；
归还这个；
}
});
视图=新的视图类（{model:model}）；
$（'#viewContent'）.append（view.render（）.el）；
});

但不起作用。有人纠正我吗

---

您想使用自定义触发器。它在您使用的版本中不可用，但在1.0.5中可用

然后，您需要添加的唯一一件事是调用绑定文本字段上的输入

this._modelBinder.bindCustomTriggers(this.model, this.el,"input input.[name=firstName]" , bindings, {changeTriggers: {'':'change', 'input.[name=firstName]':'input'}});