2009-09-24 32 views
0

代碼如下一個簡單的自動提示框......但是當我點擊列表中的建議時,它不會將內容返回到輸入框。它根本不能識別加載的html中的任何內容?JQuery:加載HTML並點擊返回值來輸入字段

JQUERY

$(document).ready(function(){ 
    $('#edit-name').keyup(function() { 
     if ($(this).val().length >= 3) { 
      bname = $(this).val(); 
      $("#searchframe").load("searchresults.php", { 'name[]': [name] }); 
     } else { 
      $("#searchframe").html(''); 
     } 
    }); 

    $('.bus').click(function() { 
      alert("testing"); // <-- nothing happens! 
     $('#edit-name').val($(this).html()); 
    }); 
}); 

HTML

... 
<body> 
    ... 
    <input type="text" id="edit-name" /> 
    <div id="searchframe"></div> 
    ... 
</body> 
... 

INJECTED HTML

<ul> 
    <li><a href="#" class="bus">test1</a></li> 
    <li><a href="#" class="bus">test2</a></li> 
</ul> 

回答

2

click事件勢必在文件負載和HTML注入後出現這種情況。我建議使用live方法,該方法將事件綁定到頁面上所有當前和將來的元素。

$('.bus').live('click', function() { 
    alert("testing"); // <-- something (should) happen! 
    $('#edit-name').val($(this).html()); 
}); 
+0

這是一個比我的更完整的答案:) 很棒! – changelog 2009-09-24 10:03:40

0

您正在設置加載自動填充建議中的DOM之前的點擊事件。

嘗試在注入的HTML內部添加該動作並讓我知道它是如何發生的。

1

您的具有「bus」類的元素在DOM負載中不存在(您稍後會動態注入它們),因此不會應用click功能。

您可以使用jQuery的live()方法將點擊函數應用於所有動態添加的元素。

$('.bus').live('click', function() { 
     alert("testing"); // <-- nothing happens! 
    $('#edit-name').val($(this).html()); 
}); 
相關問題