当我点击第一个文本框自动自动完成功能正在运行。但在脚本中插入另一个文本框后,自动完成功能不起作用。所以请建议我如何在脚本中附加自动完成类。
html:
<form id="smart-form-register" class="smart-form client-form" method="post" enctype="multipart/form-data">
<fieldset>
<section>
<label class="input"> <i class="icon-append fa fa-user"></i>
<input type="text" name="product_name" placeholder="product Name">
<b class="tooltip tooltip-bottom-right">Needed to enter product Name</b> </label>
</section>
<section>
<table style="width:100%;">
<tr>
<th style="padding-bottom:10px;">Material Name</th>
<th style="padding-bottom:10px;">Material Quantity</th>
</tr>
<tr>
<td><input name="last[]" class="auto" id="last[0]" size="40"></td>
<td><input name="first[]" id="first[0]" size="40"></td>
</tr>
</table>
</section>
<section>
<span class="glyphicon glyphicon-plus" style="margin-left:580px;" value="Add" onclick="insert()"></span>
</section>
</fieldset>
<input type="submit" name="submit" value="Register" class="btn btn-primary">
</form>
脚本:
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
//autocomplete
$(".auto").autocomplete({
source: "search1.php",
minLength: 1
});
});
</script>
<script>
var i=0
var j=0
function insert()
{
last=document.getElementById("last["+i+"]")
i++
first=document.getElementById("first["+j+"]")
j++
last.insertAdjacentHTML("AfterEnd", '<br><input class="auto" name="last[]" id="last['+i+']" size="40">')
first.insertAdjacentHTML("AfterEnd", '<br><input name="first[]" id="first['+j+']" size="40"<br>')
}
</script>
答案 0 :(得分:0)
只需在插入新行后调用自动完成脚本功能。 添加此功能&#34; autocomplete()&#34;结束&#34; insertAdjacentHTML()&#34;
<script>
var i=0
var j=0
function insert()
{
last=document.getElementById("last["+i+"]")
i++
first=document.getElementById("first["+j+"]")
j++
last.insertAdjacentHTML("AfterEnd", '<br><input class="auto" name="last[]" id="last['+i+']" size="40">').autocomplete();
first.insertAdjacentHTML("AfterEnd", '<br><input name="first[]" id="first['+j+']" size="40"<br>').autocomplete();
}
</script>