JQuery live search - populate input issue

Question

Мои знания о JQuery/Javascript очень ограничены, и у меня небольшая проблема, реализующая прямой поиск. Учитывая поле ввода, как только пользователь начнет вводить текст для поиска, окно поиска в реальном времени будет показывать возможные результаты. Если пользователь решает щелкнуть по одному из предложенных полей, щелкнутый элемент затем будет заполнен в поле ввода.

Моя проблема действительно странная. Все работает, за исключением того, что нажатые предлагаемые результаты не регистрируются при нажатии на фактический текст или изображение. Поле ввода заполняется только при нажатии на пустое пространство слоя div предлагаемого результата. Мне нужно, чтобы поле ввода заполнялось независимо от того, где сделан клик по предлагаемому результату.

HTML:

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

JQuery:

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

Ajaxsearch1.php возвращает простой HTML. Псевдокод:

Спасибо за помощь.

Answer 1

Примечание:

Живой() метод был устаревшим в 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); 
}); 

Если это не работает, то есть вопрос, который не приходит через в ваших объяснений. Например, ваш псевдокод не включает класс «имя»?