Checkbox 我必须双击复选框来更改它';妇女在木偶中的地位/
在我的HBS模板中,我有一个带有classCheckbox 我必须双击复选框来更改它';妇女在木偶中的地位/,checkbox,backbone.js,marionette,ecmascript-5,Checkbox,Backbone.js,Marionette,Ecmascript 5,在我的HBS模板中,我有一个带有classjs map source的复选框。我正在听木偶视图中点击此复选框。此部件工作正常-当我单击复选框时,我能够控制台。记录复选框状态 代码: 让我们点击几次。 控制台中出现以下日志: TypeOf: boolean; value: true TypeOf: boolean; value: false TypeOf: boolean; value: true TypeOf: boolean; value: false TypeOf: boolean; val
js map source
的复选框。我正在听木偶视图中点击此复选框。此部件工作正常-当我单击复选框时,我能够控制台。记录复选框状态
代码:
让我们点击几次。
控制台中出现以下日志:
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false
TypeOf: boolean; value: true
TypeOf: boolean; value: false`
这是意料之中的行为
当我试图在模型中保存此复选框值(true/false)时,会出现问题。让我们将this.model.set('source',switchStatus)
添加到函数mapSourceChanged
现在我必须双击复选框以标记为已选中(视觉上)。但是,我仍然可以通过单击取消选中复选框
代码:
日志:
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
行首的2
意味着我又得到了相同的日志
这种行为的原因是什么?如何修复它?从这段代码中说起来有点棘手-可能也会注销您的事件,因为它很可能是模型上的一个更改触发了您的视图正在侦听的事件-记录我们的事件将为您提供一些工作来源您是否使用了任何数据绑定库/您的输入是否包装在标签中?我找到了答案。我有一个事件侦听器,设置为模型更改。谢谢大家。
module.exports = Marionette.ItemView.extend({
# something else....
ui: {
mapSource: '.js-map-source'
# something else...
},
events: {
'click @ui.mapSource': 'mapSourceChanged'
# something else...
}
# something else...
mapSourceChanged: function (event) {
var switchStatus = $(this.ui.mapSource).is(":checked");
console.log(`TypeOf: ${typeof switchStatus}; value: ${switchStatus}`);
this.model.set('source', switchStatus);
},
}
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true
TypeOf: boolean; value: false
2TypeOf: boolean; value: true