Question

我在网上搜索过，无法找到解决方法。类似的问题要么已经回答，要么我无法实现答案。我希望有人可以帮助我！

所以，我试图将autosuggest脚本与添加额外的输入字段脚本结合起来。我有一个教授字段，可以根据需要添加更多教授字段。我可以让autosuggest与第一个教授字段一起工作，但autosuggest不会在动态添加的输入字段上运行。

我使用的autosuggest脚本是AUSU jQuery-Ajax Auto Suggest

http://plugins.jquery.com/project/au...t-autocomplete

addinput脚本来自本教程：http://new2wp.com/snippet/jquery-add...t-form-fields/

以下是标签之间的javascript：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">    
</script>
<script type="text/javascript" src="assets/js/jquery.ausu-autosuggest.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {
$.fn.autosugguest({
className: 'ausu-suggest',
methodType: 'POST',
minChars: 2,
rtnIDs: true,
dataFile: 'data.php'
});
});
</script>

<script type="text/javascript">
$(function() {
var profDiv = $('#addprofblock');
var i = $('#addprofblock p').size() + 1;

$('#addprof').live('click', function() {

$('<p><div class="ausu-suggest"><input type="text" id="professor" size="25" name="professor[]" value="" autocomplete="off" /></div><a href="#" id="remprof" style="text-decoration:none; font-weight:bold;">Remove</a></p>').appendTo(profDiv);
i++;
return false;
});

$('#remprof').live('click', function() {
if( i > 2 ) {
$(this).parents('p').remove();
i--;
}
return false;
});
});
</script>

以下是我正在创建的表单中的代码片段：

<div id="addprofblock">
<p><div  class="ausu-suggest"><input type="text" name="professor[]" id="professor" size="25" value="" autocomplete="off" /></div>
<a href="#" id="addprof" style="font-weight: bold; text-decoration: none">Add</a>
</p>
</div>

我听说有人提到livequery作为解决方案，但我无法实现它。感谢您提供的任何帮助!!

Answer 1

您必须将autosuggest函数绑定到新添加的输入字段。换句话说，每次动态添加新输入字段时，必须将autosuggest函数设置为与所述元素一起使用。

这是一个很小的例子：

function addInput() {
    var $input = $('<input type="text"/>');
    $('div').append($input);
    $input.autoSuggest({params...});
}

Answer 2

jQuery Live Query Plugin将完成这项工作。

动态添加输入字段和自动完成

2 个答案: