动态创建的标签 onclick 函数未在 jquery 中触发

Question

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

这是我的代码

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);
}

Answer 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>

动态创建的标签 onclick 函数未在 jquery 中触发

dynamically created a tag onclick function not triger in jquery

javascript

html

jquery

jquery-mobile