jquery mobile 1.3远程自动完成无法选择动态创建的列表中的元素

Question

当我单击“upperUlProductSearch”类时，我设置了警报，但是当我单击 ajax 创建列表中的 li 时，我没有收到响应。我还有一个 a 标签和另一个具有相同类的静态 ul li，单击时确实会给我警报。我希望有人能帮助我弄清楚为什么我不能瞄准 ajax li 或正确的方法。提前致谢!!!

jquery:

$( document ).on( "pageinit", "#template", function() {
$( "#upperApplianceSearch" ).on( "listviewbeforefilter", function ( e, data ) {
    var $ul = $( this ),
        $input = $( data.input ),
        value = $input.val(),
        html = "";
    $ul.html( "" );
    if ( value && value.length > 1 ) {
        $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
        $ul.listview( "refresh" );
        $.ajax({
            url: "productautocomplete.php",
            type: "POST",
            dataType: "json",
            data: {
                q: $input.val()
            }
        })
        .then( function (data) {
            $.each( data, function ( i, val ) {
                /*html += "<li><a href='#' data-role='none' value=" + val.productId + ">" + val.productName + "</a></li>";*/
                html += '<li class="upperUlProductSearch" id=' + val.productId + '>' + val.productName + '</li>';
            });
            $ul.html( html );
            $ul.listview( "refresh" );
            $ul.trigger( "updatelayout");
        });
    }
});
})

$(".upperUlProductSearch").click(function() {
alert ("helleo");
});

html:

<ul id="upperApplianceSearch" class="ui-listview ui-listview-inset ui-
corner-all ui-shadow" data-filter-theme="d" data-filter-placeholder="Find an  
appliance..." data-filter="true" data-icon="false" data-inset="true" data- 
role="listview">

<li id="41" class="upperUlProductSearch ui-li ui-li-static ui-btn-up-f ui- 
first-child ui-last-child">Hawley</li>
</ul>

<a class="upperUlProductSearch ui-link">Hello</a>

<ul class="ui-listview" data-role="listview">
  <li class="upperUlProductSearch ui-li ui-li-static ui-btn-up-f ui-first- child ui-last-child">Li Test</li>
</ul>

Answer 1

替换:

$(".upperUlProductSearch").click(function() {
    alert("helleo");
});

与:

$('#upperApplianceSearch').on('click', 'li', function () {
    alert("helleo");
});