Ajax+Javascript動態生成文本輸入框
來源:程序員人生 發布時間:2014-04-06 00:38:10 閱讀次數:2661次
Html文件的代碼
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<!--
JAVASCRIPT編寫需要使用網頁的<script>元素,如下所示.
<script>元素的language屬性用于設置script是用什么語言實現的. 如使用外部JAVASCRIPT還需要設置src屬性.
-->
<script language="javascript" src="test.js">
</script>
</head>
<body>
<div id="tardiv">
</div>
<form>
<input id="txtNumber" type="text" value="1" size="5" />
<input id="btnNumber" name="Submit" type="button" value="submit" onclick="showmessage(txtNumber.value, 'tardiv')">
</form>
</body>
</html>
test.js的代碼:
// JavaScript Document
//
//用JAVASCRIPT動態生成 文本輸入框 到頁面中,
//amount參數是表示生成文本輸入框的個數, target參數是 將要顯示生成的文本輸入框的控件ID名
function showmessage(amount, target)
{
var strContent;
//用循環動態生成文本輸入框并保存到strContent中.
for (i=0; i<amount; i++)
{
strContent += '<input id="txt' + i +'" type="text" value="' + i + '" size="5" /> <br />';
}
//用JAVASCRIPT的document對象的getElementById()方法中的innerHTML屬性定義 target控件內容.
document.getElementById(target).innerHTML = strContent;
}