使用jquery在onclick事件中不显示li的值

时间:2014-12-31 04:29:42

标签: jquery ajax html-lists

我正在尝试在用户在输入标记中提供类型时加载列表,如下所示

$("#search_name").keyup(function(e) {
//After validating the input, I am loading data like below..this works fine..
$.ajax({
    url: "file.php",
    type: "get",
    data: { name : name_value },
    dataType: "html",
    success: function (data) {
    var height_div=25*(data.split("</li>").length-1);
    $("#myDiv").empty();
    $("#myDiv").append(data);
    $("#myDiv").height(height_div);
    $("#myDiv").show();
    $("#myDiv ul li").hover(
    function() {
        $("#ul_names li").css('backgroundColor','white');
        $(this).css('backgroundColor','#ccc'); },
        function() {
            $("#ul_names li").css('backgroundColor','white');
            $(this).css('backgroundColor','#ccc'); });
    $("#myDiv ul li").click(function() {
        alert($(this).text()); });
    }
});

悬停事件有效,但点击事件无效。

我的HTML

<div id="view_others" style="display:none">
    <input id="search_name" type="text" value="Type The Name to Open Specific Individual Artifact's" size="80" style="position:absolute;top:35px;text-transform:capitalize"/>
    <div id="myDiv" style="position:relative;top:50px;left:1px;background-color:white;width:504px;display:none;"></div>
</div>

PHP文件返回类似..

的内容
<ul id="ul_names">
    <li>one</li>
    <li>two</li>
</ul>

我尝试用

替换点击功能
    $("#myDiv ul").on('click','li',function() .....

但这也不起作用..

谁能告诉我这里做错了什么?

1 个答案:

答案 0 :(得分:0)

$("#myDiv ul li").hover(function() {
        $("#ul_names li").css('backgroundColor','white');
        $(this).css('backgroundColor','#ccc'); 
}).on('click',function() {
    alert($(this).text()); });
});