我使用Jquery自动完成来查询数据库。该函数绑定到所有带有“completeme_accounts”类的文本字段。这适用于默认文本字段,该字段在页面加载时出现。但是,当我通过Jquery添加更多文本字段时,自动完成功能对它们不起作用。我在这里检查了几个类似的解决方案,但我找不到适用于我的代码的解决方案。我猜我需要使用Jquery .on(因为现场已被弃用)但我不知道如何。我的代码:
$(document).ready(function(){
$(function() {
function log( message ) {
$( "<div>" ).text( message ).prependTo( "#log" );
$( "#log" ).scrollTop( 0 );
}
$( ".completeme_accounts" ).autocomplete({
mustMatch: true,
source: "accounts_autocomplete.php",
minLength: 2,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.value + " aka " + ui.item.id :
"Nothing selected, input was " + this.value );
},
change: function (event, ui) {
if (!ui.item) {
$(this).val('');
}
}
});
});
}); // Doc ready
包含输入字段的表:
<table id="addaccount">
<tr>
<td><div class="ui-widget"><input name="account[1]" type="text" class="completeme_accounts" id="account1" value=""></div></td>
<td><input type="radio" name="source" id="radio" value="radio" class="required"></td>
</tr>
<tr>
<td colspan="2"><a href="#" id="addrow" onclick="return false;">Add another account</a></td>
</tr>
</table>
附加额外输入字段的脚本:
<script>
$rowid = 1;
$("#addrow").on("click", function(){
$rowid = $rowid + 1;
$('#addaccount tr:last').before('<tr><td><div class="ui-widget"><input name="account['+$rowid+']" type="text" class="completeme_accounts" id="account'+$rowid+'" value=""></div></td><td><input type="radio" name="payment_source" id="radio" value="radio" class="required"></td></tr>');
});
</script>
答案 0 :(得分:0)
我不确定你在该脚本中究竟要做什么,但如果你想改变自动完成的可能值,你可以这样做:
$( "#tags" ).autocomplete( "option", "source",["the", "values", "you", "want"]);
答案 1 :(得分:0)
在append
文本框之前,已经加载了 DOM ,因此autocomplete
未在追加输入上启动。
您必须在附加的输入上再次启动autocomplete
。
将一个类添加到div .append_input
<div class="ui-widget append_input">
<input name="account['+$rowid+']" type="text" class="completeme_accounts"
id="account'+$rowid+'" value="">
</div>
再次启动自动完成
var appendInput = $(this).closest('#addaccount').find('.append_input').children('.completeme_accounts');
appendInput.autocomplete(yourcode);