Question

我对JQuery / Javascript的了解非常有限，而且我在实现实时搜索方面遇到了一个小问题。给定输入字段，一旦用户开始键入要搜索的内容，实时搜索框将显示可能的结果。如果用户决定单击其中一个建议字段，则单击的项目将填充到输入框中。

我的问题很奇怪。一切正常，但点击的建议结果如果点击实际文本或图像则不会注册。仅当单击建议结果的div层的空白空间时，才会填充输入框。我需要它，以便无论在建议的结果上点击何处，都会填充输入框。

HTML：

"ifRoom"

JQuery的：

<input autocomplete=off name="search1" type="text" class="search1" id="searchid1"/>
<div id="result1"></div>

Ajaxsearch1.php返回纯HTML。伪代码：

$(function(){
    $(".search1").keyup(function() 
    { 
    var searchid1 = $(this).val();
    var dataString = 'search1='+ searchid1;
    if(searchid1!='')
    {
        $.ajax({
        type: "POST",
        url: "ajaxsearch1.php",
        data: dataString,
        cache: false,
        success: function(html)
        {
        $("#result1").html(html).show();
        }
        });
    }return false;    
    });

    jQuery("#result1").live("click",function(e){ 
        var $clicked = $(e.target);
        var $name = $clicked.find('.name').html();
        var decoded = $("<div/>").html($name).text();
        $('#searchid1').val(decoded);
    });
    jQuery(document).live("click", function(e) { 
        var $clicked = $(e.target);
        if (! $clicked.hasClass("search1")){
        jQuery("#result1").fadeOut(); 
        }
    });
    $('#searchid1').click(function(){
        jQuery("#result1").fadeIn();
    });
    });

感谢您的帮助。

Answer 1

注意：

live（）方法在jQuery 1.7版中已弃用，并已删除版本1.9。改为使用on（）方法。

Answer 2

试试这个：

$('#result1').on('click', '.show', function(e){
    var img_name = $(this).find('.name').html();
    $('#searchid1').val(img_name);
});

而不是：

jQuery("#result1").live("click",function(e){ 
    var $clicked = $(e.target);
    var $name = $clicked.find('.name').html();
    var decoded = $("<div/>").html($name).text();
    $('#searchid1').val(decoded);
});

如果这不起作用，那么您的解释中就会出现一个问题。例如，您的伪代码在任何地方都不包含“名称”类？

JQuery实时搜索 - 填充输入问题

2 个答案: