有一个效果,需要动态添加Table中的列,某一个TD中,使用了autocomplete 填充数据,默认的代码<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>测试页面</title>
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script type='text/javascript' src='js/jquery.autocomplete.js'></script>
<script type='text/javascript' src='js/localdata.js'></script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />
<link rel="stylesheet" type="text/css" href="css/thickbox.css" />
<script type="text/javascript">
function add() {
var tr = $("#table1 tr").eq(0).clone();
tr.appendTo("#table1"); }
$().ready(function(){
//1 example
$("#suggest1").autocomplete(cities);
//2 example
var emails = [
{ name: "Peter Pan", to: "[email protected]" },
{ name: "Molly", to: "[email protected]" },
{ name: "Forneria Marconi", to: "[email protected]" },
{ name: "Master <em>Sync</em>", to: "[email protected]" },
{ name: "Dr. <strong>Tech</strong> de Log", to: "[email protected]" },
{ name: "Don Corleone", to: "[email protected]" },
{ name: "Mc Chick", to: "[email protected]" },
{ name: "Donnie Darko", to: "[email protected]" },
{ name: "Quake The Net", to: "[email protected]" },
{ name: "Dr. Write", to: "[email protected]" }];
$("#autocomplete").autocomplete(emails, {
minChars: 0,
max:15,
width: 200,
autoFill: false,
scroll: false,
scrollHeight: 500,
formatItem: function(data, i, total) {
return data.name+data.to
},
formatMatch: function(data, i, total) {
return data.name;
},
formatResult: function(data, value) {
return data.name;
}
}).result(function(event, data, formatted) { //回调
// alert(data.to);
$("#twoColum_abbr").html(data.to);
});
//3 example
$("#autocom").autocomplete("data.aspx", {
minChars: 0,
max:10,
width: 200,
autoFill: false,
scroll: false,
scrollHeight: 500,
//需要把data转换成json数据格式
parse: function(data) {
return $.map(eval(data), function(row) {
return {
data: row,
value: row.name,
result: row.name + " <" + row.to + ">"
}
});
},
formatItem: function(data, i, total) {
return data.name+data.to
},
formatMatch: function(data, i, total) {
return data.name;
},
formatResult: function(data, value) {
return data.name;
}
}).result(function(event, data, formatted) { //回调
// alert(data.to);
$("#content").html(data.to);
});
})
</script>
</head>
<body>
<form id="form1" runat="server">
自动完成字符串数组:
<input type="text" id="suggest1" />
<br/>
自动完成对象数组:
<input type="text" id="autocomplete" />
<div id="twoColum_abbr"></div>
<br/>
数据库中提出:
<table id="table1">
<tr>
<td><input type="text" id="autocom" /></td>
</tr>
<tr>
<td><a href="#" onclick="add()">add</a></td>
</tr>
</table>
<div id="content"></div>
</form>
</body>
</html>上面代码没有问题,可以出发autocomplete的问题.
但是通过onclick="add()"动态添加的Input无法触发有人遇到过吗,>?
<head runat="server">
<title>测试页面</title>
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script type='text/javascript' src='js/jquery.autocomplete.js'></script>
<script type='text/javascript' src='js/localdata.js'></script>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />
<link rel="stylesheet" type="text/css" href="css/thickbox.css" />
<script type="text/javascript">
function add() {
var tr = $("#table1 tr").eq(0).clone();
tr.appendTo("#table1"); }
$().ready(function(){
//1 example
$("#suggest1").autocomplete(cities);
//2 example
var emails = [
{ name: "Peter Pan", to: "[email protected]" },
{ name: "Molly", to: "[email protected]" },
{ name: "Forneria Marconi", to: "[email protected]" },
{ name: "Master <em>Sync</em>", to: "[email protected]" },
{ name: "Dr. <strong>Tech</strong> de Log", to: "[email protected]" },
{ name: "Don Corleone", to: "[email protected]" },
{ name: "Mc Chick", to: "[email protected]" },
{ name: "Donnie Darko", to: "[email protected]" },
{ name: "Quake The Net", to: "[email protected]" },
{ name: "Dr. Write", to: "[email protected]" }];
$("#autocomplete").autocomplete(emails, {
minChars: 0,
max:15,
width: 200,
autoFill: false,
scroll: false,
scrollHeight: 500,
formatItem: function(data, i, total) {
return data.name+data.to
},
formatMatch: function(data, i, total) {
return data.name;
},
formatResult: function(data, value) {
return data.name;
}
}).result(function(event, data, formatted) { //回调
// alert(data.to);
$("#twoColum_abbr").html(data.to);
});
//3 example
$("#autocom").autocomplete("data.aspx", {
minChars: 0,
max:10,
width: 200,
autoFill: false,
scroll: false,
scrollHeight: 500,
//需要把data转换成json数据格式
parse: function(data) {
return $.map(eval(data), function(row) {
return {
data: row,
value: row.name,
result: row.name + " <" + row.to + ">"
}
});
},
formatItem: function(data, i, total) {
return data.name+data.to
},
formatMatch: function(data, i, total) {
return data.name;
},
formatResult: function(data, value) {
return data.name;
}
}).result(function(event, data, formatted) { //回调
// alert(data.to);
$("#content").html(data.to);
});
})
</script>
</head>
<body>
<form id="form1" runat="server">
自动完成字符串数组:
<input type="text" id="suggest1" />
<br/>
自动完成对象数组:
<input type="text" id="autocomplete" />
<div id="twoColum_abbr"></div>
<br/>
数据库中提出:
<table id="table1">
<tr>
<td><input type="text" id="autocom" /></td>
</tr>
<tr>
<td><a href="#" onclick="add()">add</a></td>
</tr>
</table>
<div id="content"></div>
</form>
</body>
</html>上面代码没有问题,可以出发autocomplete的问题.
但是通过onclick="add()"动态添加的Input无法触发有人遇到过吗,>?
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货