Javascript 无法识别Jquery单击函数

我正在尝试动态生成一个元素，并使用下面的代码将该元素绑定到一个单击事件..一切正常，但单击datasource时没有触发单击事件

function create_datasource_facet(facetcount){
        console.log(JSON.stringify(facetcount))
        $('#filters').append('<div id="datafacet"></div>')
        $.each(facetcount,function(index,value){
                console.log(value);
                console.log(index);
                $('#datafacet').append('<br>')
                $('#datafacet').append('<div id="datasource">' + index + '[' + value + ']  </div>')
                //$('#datafacet').append('<br>')

        })

$(document).on('click','#datssource',function(){ alert('datasource clicked')})

}

function create\u datasource\u facet（facetcount）{
log（JSON.stringify（facetcount））
$（“#过滤器”）。附加（“”）
$.each（FaceCount，函数（索引，值）{
console.log（值）；
控制台日志（索引）；
$（“#datafacet”）。追加（“
”）
$（'#datafacet'）。追加（'+index+'['+value+']'））
//$（“#datafacet”）。追加（“
”）
})
$（文档）.on（'click'，'#datsource'，function（）{alert（'datasource clicked'）}）
}

此处的ID值有一个输入错误：

$(document).on('click','#datssource',function(){ alert('datasource clicked')})
----------------------------^

您在单击事件处理程序中错误地拼写了

#datasource

---

---

需要注意的一件事是，您可能试图附加多个id为“#datasource”的元素。ID应该是唯一的，因此您最好将其放入一个类

。数据源
单击
\datasource
上的
事件，而不是
\datsource

function create_datasource_facet(facetcount){
        console.log(JSON.stringify(facetcount))
        $('#filters').append('<div id="datafacet"></div>')
        $.each(facetcount,function(index,value){
                console.log(value);
                console.log(index);
                $('#datafacet').append('<br>')
                $('#datafacet').append('<div id="datasource">' + index + '[' + value + ']  </div>')
                //$('#datafacet').append('<br>')

        })

$(document).on('click','#datasource',function(){ alert('datasource clicked')})

}

function create\u datasource\u facet（facetcount）{
log（JSON.stringify（facetcount））
$（“#过滤器”）。附加（“”）
$.each（FaceCount，函数（索引，值）{
console.log（值）；
控制台日志（索引）；
$（“#datafacet”）。追加（“
”）
$（'#datafacet'）。追加（'+index+'['+value+']'））
//$（“#datafacet”）。追加（“
”）
})
$（文档）.on（'click'，'#datasource'，function（）{alert（'datasource clicked'）}）
}
认为您的代码在加载文档之前已加载

试试看

$('#datssource').on('click',function(){ alert('datasource clicked')})

}

$（文档）中存在拼写错误。在（'click'，'#datsource'，function（）
上还请注意，即使javascript有ASI，严格的浏览器也会在这方面出现问题。为了安全起见，最好用分号关闭所有内容。您也拼写错了ID值。：-@isherwood这是真的。删除了它，并在一个关于重复ID的注释中添加了他可能会遇到的问题，因为我没有捕捉到重复的ID。好的。OP还可以增加ID。