Question

我有这个胡子设置：

$.getJSON('data/data.json', function(data) {
     var template = "<ul>{{#"+elements+"}}<li class=\"selector {{.}}\"></li>{{/"+elements+"}}</ul>";
     var html = Mustache.to_html(template, data);
     panel.html(html);
});

在此之后，我需要在<li>元素上添加一些类selector的操作。但是这个元素渲染到DOM有一点问题。所以我使用小函数来检查这个元素确实存在，但是有些东西是错的，我没有结果......

$.fn.doesExist = function(){
    return $(this).length > 0;
};

var picker = $('li.selector');
if (picker.doesExist()) {
    $(this).click(function(){
        console.log('log');
    })
}

和我的HTML：

<div class="panel">
  <ul>
    <li class="selector 01"></li>
    <li class="selector 02"></li>
    <li class="selector 03"></li>
  </ul>
</div>

Answer 1

试试这个：

$.getJSON('data/data.json', function(data) {
     var template = "<ul>{{#"+elements+"}}<li class=\"selector {{.}}\"></li>{{/"+elements+"}}</ul>";
     var html = Mustache.to_html(template, data);
     panel.html(html);
     //*******************
     // PERFORM TEST HERE
     //*******************
});

 //*******************
 // $.getJSON() is asynchronous so 
 // performing test here is too early.
 // The response from the server is guaranteed
 // not to have arrived yet.
 //*******************

Answer 2

尝试

if($('li.selector').length>0){
    $('li.selector').click(function(){
         alert("wow")
    })
}

jsFiddle

小胡子模板后如何检查元素确实存在

2 个答案: