使用js動態添加各類表單元素
一、源碼
<html >
<head>
<title>動態添加表單元素</title>
</head>
<script language="javascript">
function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");
TemO.appendChild(newline);
}
</script>
<body>
<form action="" method="get" name="frm">
<div id="add">
<input type="text" name="textfield">
</div>
</form>
<input name="" type="button" value="新建文本框" onClick="AddElement('text')" />
<input name="" type="button" value="新建複選框" onClick="AddElement('checkbox')" />
<input name="" type="button" value="新建單選框" onClick="AddElement('radio')" />
<input name="" type="button" value="新建文件域" onClick="AddElement('file')" />
<input name="" type="button" value="新建密碼框" onClick="AddElement('password')" />
<input name="" type="button" value="新建提交按鈕" onClick="AddElement('submit')" />
<input name="" type="button" value="新建恢復按鈕" onClick="AddElement('reset')" />
</body>
</html>
二、效果
相關文章
- 1. javascript動態添加form表單元素
- 2. JS動態添加元素實例
- 3. 原生JS中動態添加元素
- 4. JS動態添加div，而後在div中添加元素
- 5. 使用jquery加ajax動態添加select的option子元素
- 6. Vue動態給一個元素添加類名，兄弟元素移除類名
- 7. 用JQuery動態爲選中元素添加/刪除類
- 8. jquerymobile動態添加元素以後
- 9. vue頁面動態添加元素
- 10. SVG動態添加元素與事件
- 更多相關文章...
- • XQuery 添加元素 和屬性 - XQuery 教程
- • jQuery Mobile 表單滑動條 - jQuery Mobile 教程
- • 使用阿里雲OSS+CDN部署前端頁面與加速靜態資源
- • Composer 安裝與使用
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
最新文章
- 1. CVPR 2020 論文大盤點-光流篇
- 2. Photoshop教程_ps中怎麼載入圖案？PS圖案如何導入？
- 3. org.pentaho.di.core.exception.KettleDatabaseException:Error occurred while trying to connect to the
- 4. SonarQube Scanner execution execution Error --- Failed to upload report - 500: An error has occurred
- 5. idea 導入源碼包
- 6. python學習 day2——基礎學習
- 7. 3D將是頁遊市場新賽道？
- 8. osg--交互
- 9. OSG-交互
- 10. Idea、spring boot 圖片(pgn顯示、jpg不顯示)解決方案
歡迎關注本站公眾號,獲取更多信息
