如何正确预先增强jQuery Mobile的胡须模板？

我试图加快我的jQuery Mobile和backbone.js的应用程序，特别是当它是增强表单元素（并且有很多）的部分。我想我可以让jQM“预先增强”表单模板，然后使用增强的标记编译模板功能，而不必增强每个页面呈现中的所有表单元素。这工作正常，直到我实现了检查/取消选中复选框。模板基本上看起来像：如何正确预先增强jQuery Mobile的胡须模板？

<form> 
    <fieldset data-role="controlgroup"> 
     <legend>{{legend}}</legend> 
     {{#items}} 
     <label for="{{id}}">{{#name}}{{name}}{{/name}}{{^name}}No name given{{/name}}</label> 
     <input type="checkbox" id="{{id}}" {{#checked}}checked{{/checked}}> 
     {{/items}} 
    </fieldset> 
</form>

当我在骨干 - 视图定义我的模板功能，我想做到以下几点：

var preEnhance = $('<div>').hide().html($('#tmpl').html()).appendTo($('body')).trigger('create'); 
return Mustache.compile(preEnhance.html());

我想用它对付这样的数据：

{legend: 'Pre Enhanced Forms, How?', items:[{id:'a',name:'A', checked: true},{id:'b',name:'B'},{id:'c'}]}

然而，jQuery Mobile的做一些奇怪的{{#checked}}checked{{/checked}}部分：它变成{{#checked}}checked{{="" checked}}=""我的猜测是由于/，jQM将解释为结束标记的开始（纠正我，如果我错了）。像这样，我无法再渲染模板。

我可以做些什么吗？难道我做错了什么？有没有更好的方式来使用预增强模板？我不想在我的模板中使用增强和硬编码标记。

还有一个（失败的）demo fiddle有兴趣的人。

来源

2013-04-22 m90

试试这个。只需添加选中的属性并传递选中的值即可。

<input type="checkbox" id="{{id}}" checked="{{#checked}}{{checked}}{{/checked}}" >

我更新的jsfiddle http://jsfiddle.net/PxfGt/4/

来源

2013-04-25 03:19:32 ricardohdz

谢谢，这解决了'{{=“'但不知何故，将所有的复选框选中，即使我将它们明确地'FALSE'。 – m90 2013-04-26 08:16:38

这是因为在HTML'checked'和'checked =“选中''都意味着应该检查盒子。 – jwadsack 2015-05-15 22:02:47

如何正确预先增强jQuery Mobile的胡须模板？

回答

相关问题