不知道为什么jQuery find（）方法不起作用

Question

更新：对于您的的人来说，这不是语法问题。正如我最初所怀疑的那样，正确加载html模板时出现问题，并且复选框更新在完成之前就已运行。所以，如果看起来好像你正在寻找的元素不存在，那么情况可能就是这样。 AsyncJS

原文：好吧，我以为我比这更好，但我已尽我所能。我有一个简单的任务管理器webapp 。我希望在成功获取请求后，当我的任务对象的状态属性为“true”时，将复选框输入字段的“已检查”属性设置为“true”。

在我这样做之前，我通过调用辅助函数使用Mustache.js 模板引擎注入我的动态html。我创建了一个回调函数，一旦html被注入就会执行，以避免在我将'checked'标记为'true'时搜索任何内容。这一切看起来像这样：

DOM:

// AJAX call for getting current tasks
$.ajax({
    url: '/tasks',
    type: 'GET'
}).done(function(response, textStatus, jqXHR){
    $.each($.parseJSON(response), function(i, task){
        insertTask(task, function(){
            if (task.status == true){
                console.log("Task with status of 'true': ");
                console.log(task);
                console.log("Below should be the checkbox");
                console.log($('body').find($('#' + task.id)));
                $('#tasks').find($('#' + task.id)).prop('checked', true);
            }
        });
    });

模板处理程序：

    // Uses the mustache template engine to dynamically insert tasks into DOM
function insertTask(data, callback){
    $.Mustache.load('templates/tasks.html', function() {
        $('#tasks').mustache('main_form', data);
    });
    if (callback && typeof(callback) == 'function'){
        callback();
    }
}

输出：

当我console.log($('#tasks').find('#' + task.id)); 时，我回来的是#tasks对象。即使我只是搜索'li'，它也会返回#task对象。显然这听起来像html还没有被注入。但是我没有看到如果我有回调功能那么可能。

Answer 1

您的复选框的id类似于2a49...。

您的选择器为$('#tasks').find($('#task_' + task.id)).prop('checked', true);

它编译为

>>$('#tasks #task_2a49....

在尝试使用id = task_2a49....找到元素时，不会返回任何内容。

只需使用，

$('#tasks').find('#'+task.id) 

将您的电话callback()拨入.load()。在load()返回结果之前触发了回调。

$.Mustache.load('templates/tasks.html', function() {
    $('#tasks').mustache('main_form', data);

    if (callback && typeof(callback) == 'function'){
        callback();
    }
});

Answer 2

ID和NAME令牌必须以字母（[A-Za-z]）开头，后面可以跟任意数量的字母，数字（[0-9]），连字符（“ - ”），下划线（“ _“），冒号（”：“）和句号（”。“）。

link to more info