jquery-mobile之knockout 和 jQuery Mobile : Checkboxes

不点 阅读:25 2024-11-24 20:56:43 评论:0

我正在尝试将复选框和标签元素动态添加到文档中。 Checkbox 元素具有 Knockout 的数据绑定(bind)属性,可将其值绑定(bind)到 ViewModel 中的可观察值。但是,当我尝试通过执行

使用 jQuery Mobile 设置复选框样式时
$('input[type="checkbox"]').checkboxradio(); 

数据绑定(bind)属性将被删除。如果我省略上面的行,数据绑定(bind)属性设置正确并且绑定(bind)有效。

有没有办法同时拥有 jQuery Mobile 样式和 Knockout 绑定(bind)?

我正在使用 jQuery Mobile RC1 和 Knockout 1.2.1。

请您参考如下方法:

我也遇到过这个问题。不幸的是,这里的所有建议要么对我不起作用,要么有其他问题。所以我创建了一个简单的自定义绑定(bind),适用于所有版本的 KO(包括最新的 v3):

ko.bindingHandlers.jqmChecked = { 
    init: ko.bindingHandlers.checked.init, 
    update: function (element, valueAccessor) { 
        //KO v3 and previous versions of KO handle this differently 
        //KO v3 does not use 'update' for 'checked' binding 
        if (ko.bindingHandlers.checked.update)  
            ko.bindingHandlers.checked.update.apply(this, arguments); //for KO < v3, delegate the call 
        else  
            ko.utils.unwrapObservable(valueAccessor()); //for KO v3, force a subscription to get further updates 
 
        if ($(element).data("mobile-checkboxradio")) //calling 'refresh' only if already enhanced by JQM 
            $(element).checkboxradio('refresh'); 
    } 
}; 

应该这样使用:

<input type="checkbox" data-bind="jqmChecked: someValue" id="checkbox1"/> 

在此处查看完整的工作示例:

http://jsfiddle.net/srgstm/ub6sq/


标签:jquery
声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

关注我们

一个IT知识分享的公众号