Question

这是应显示我的搜索结果的表格：

<table id="searchbarresults">

</table>

这是我的javascript：

 jQuery(document).ready(function(){
jQuery("#searchresults").keyup(function(){

 for(i=0;i<searchbarresultarray.length;i++){

           htmloutput= htmloutput+"<tr><td class='searchbarresult' id='"+i+"'>"result"</td></tr>";

            }
    jQuery("#searchresults").html(htmloutput);

});

jQuery(".searchbarresult").mouseover(function(){
      jQuery(this).css( "background-color", "black" ); 
    });
});

这将输出包含表格行的列表。所有类都有'searchbarresult'和一个独特的id。但它不起作用。是因为在挂接鼠标悬停事件后创建了表行吗？我怎么能绕过这个？

Answer 1

试

jQuery(document).on('mouseover','.searchbarresult',function(){
    jQuery(this).css( "background-color", "black" ); 
});

Answer 2

要使表行可单击，请将onclick="window.location='#';"添加到tr元素，如下所示：

 jQuery(document).ready(function(){
    jQuery("#searchresults").keyup(function(){

     for(i=0;i<searchbarresultarray.length;i++){

               htmloutput= htmloutput+"<tr onclick="window.location='#';"><td class='searchbarresult' id='"+i+"'>"result"</td></tr>";

                }
        jQuery("#searchresults").html(htmloutput);

    });

    jQuery(document).on('mouseover','.searchbarresult',function(){
        jQuery(this).css( "background-color", "black" ); 
     });
    });

如何使动态创建的表行可单击

2 个答案: