Javascript jsrender使用已选择的选项填充多个selectbox

我想通过Jsrender填充选择框

代码正确地填充了选择框，但默认情况下我无法选择很少的值。我为此创建了一个Jsrender助手函数，但我认为其他值在循环中是不可访问的，所以这就是该函数不起作用的原因

这里是链接到

我的html是

<div class="select_placeholder"></div>
<script id="selectbox" type="text/x-jsrender">
<select multiple="multiple" name="">
{{for cats }}
{{include tmpl="#selectbox_options"/}}
{{/for}}
</select>
</script>
<script id="selectbox_options" type="text/x-jsrender" >
    <option value="{{:term_id}}" {{>~selected(term_id, selected)}} >{{:name}}</option>
</script>

{{猫的}}
{{include tmpl=“#selectbox_options”/}
{{/for}}
~selected（term_id，selected）}>{{{:name}

我的javascript是

$.views.helpers({

        selected: function(needle,haystack) {
            console.log(haystack);
            if(typeof haystack === "undefined" || haystack === null) { 
                return;
            }
            var count=haystack.length;
            for(var i=0;i<count;i++){
                if(haystack[i]===needle){return 'selected="selected"'; }
            }
            return;
        }
    });
var cates = [
        {'term_id' : 1, 'name' : 'category 1'},
        {'term_id' : 2, 'name' : 'category 2'},
        {'term_id' : 3, 'name' : 'category 3'},
        {'term_id' : 4, 'name' : 'category 4'},
        {'term_id' : 5, 'name' : 'category 5'},

    ];
    var selected = [{'term_id' : 3}, {'term_id' : 4}];
    $( ".select_placeholder" ).html(
        $( "#selectbox" ).render({cats : cates,selected:selected})
   );

$.views.helpers({
已选择：功能（打捆针、干草堆）{
控制台日志（haystack）；
如果（干草堆的类型==“未定义”| |干草堆===null）{
返回；
}
var count=haystack.length；
对于（var i=0；i尝试组合数据以供查看

var cates=[
{'term_id'：1，'name'：'category 1'}，
{'term_id'：2，'name'：'category 2'}，
{'term_id'：3，'name'：'category 3'}，
{'term_id'：4，'name'：'category 4'}，
{'term_id'：5，'name'：'category 5'}，
];
所选变量=[{'term_id'：3}，{'term_id'：4}]；
对于（变量i=0；i

html


{{猫的}}
{{:name}
{{/for}}
Done知道为什么JSFIDLE不在chrome中工作，但在fire fox中工作。
var cates = [
        {'term_id' : 1, 'name' : 'category 1'},
        {'term_id' : 2, 'name' : 'category 2'},
        {'term_id' : 3, 'name' : 'category 3'},
        {'term_id' : 4, 'name' : 'category 4'},
        {'term_id' : 5, 'name' : 'category 5'},

    ];
    var selected = [{'term_id' : 3}, {'term_id' : 4}];

  for(var i = 0; i< selected.length; i++) {
        for(var j = 0; j < cates.length; j++)
                if(selected[i].term_id === cats[j].term_id) {
            cats[j].selected = true;
        }
    }
$( ".select_placeholder" ).html(
               $( "#selectbox" ).render({cats : cates})
             );

<div class="select_placeholder"></div>
<script id="selectbox" type="text/x-jsrender">
<select multiple="multiple" name="">
{{for cats }}
<option value="{{:term_id}}" {{if selected}}selected="selected"{{/if}} >{{:name}}</option>
{{/for}}
</select>
</script>