动态创建标签onclick函数不会在jquery中触发答案

【问题标题】：dynamically created a tag onclick function not triger in jquery动态创建标签onclick函数不会在jquery中触发
【发布时间】：2020-09-20 01:27:45
【问题描述】：

我使用 jquery mobile 开发了一个网络应用程序。我想通过单击我动态创建的锚标记来调用一个函数。但它没有触发并表示该功能未定义。任何帮助将不胜感激。

这是我的代码

function itemSearch(para) {
    $.ajax({
        url: "http://localhost:4000/products/filter/"+para,
        contentType: 'application/json',
        dataType: 'json',
        type: 'GET',
        success: function(data) {

            let output='';
            for (var i = 0; i < data.length; i++) {
                let img="http://localhost:4000/"+data[i].ImgPath.replace("Product\\","");
                output +=`
                    <li>
                        <a onclick="itemClicked('${data[i]._id}')" href="#" >
                            <img src="${img}">
                            <h3>${data[i].Category}</h3>
                            <p>Price : ${data[i].Price}</p>
                        </a>
                    </li>
                    `
                $('#items').html(output).listview('refresh');
                $('#search').val("");
            }
        }
    });
}

function itemClicked(id) {
 alert(id);
}

【问题讨论】：

itemClicked 是否定义在全局范围内？
@Taplar 在我的 onload 函数中没有，但是当我在锚标记之外调用该函数时，它的调用没有问题

标签： javascript html jquery jquery-mobile

【解决方案1】：

由于itemClicked函数是在另一个函数的作用域内声明的，<a>标签不能访问它。

这说明了问题，解决方法是将itemClicked移动到全局范围内。

window.onload = function () {
  function itemClicked () {
    alert('itemClicked');
  }
}();

function globalIemClicked () {
    alert('globalIemClicked');
}

<a onclick="itemClicked()" href="#">Run itemClicked</a><br/>
<a onclick="globalIemClicked()" href="#">Run globalitemClicked</a>

【讨论】：