快捷導(dǎo)航

js創(chuàng)建一個input數(shù)組并綁定click事件的方法

更新時間：2014年06月12日 11:23:38 投稿：whsnow

這篇文章主要介紹了js創(chuàng)建一個input數(shù)組并綁定click事件的方法,需要的朋友可以參考下

 
</pre><pre name="code" class="javascript"><html> 
<body> 
<input type="button" name="input[]" value="按鈕1" /><br /> 
<input type="button" name="input[]" value="按鈕2" /><br /> 
<input type="button" name="input[]" value="按鈕3" /><br /> 

<div id="add"></div> 
</body> 
</html> 

<script type="text/javascript"> 

// 通過 getElementsByTagName 獲得都有 input 控件 
var inputs =document.getElementsByTagName("input"); 
// 為第0個button綁定onclick事件，alert一下 
inputs[0].onclick = function(){ 
alert("我測試一下"); 
} 

// 為每一個button綁定onclick事件，alert一下 
for(var i=0;i<inputs.length;i++){ 
inputs[i].onclick = function(){ 
alert("我測試一下"); 
} 
} 

window.onload = function(){ 
// 定義一個數(shù)組 arrs 
var arrs = new Array(); 
// 循環(huán)添加 
for(var i=0;i<2;i++){ 
// 循環(huán)添加兩個 input type="button" value="新增"+i 
var input = document.createElement("input"); 
input.type = "button"; 
input.value = "新增" + i; 
// 記得把創(chuàng)建的 input 放入 arrs 中 
arrs.push(input); 
// 然后把 input 放入 id="add" 的div中 
document.getElementById("add").appendChild(input); 
} 

// 同樣用 [0].onclick 綁定事件，依然沒有問題 
arrs[0].onclick=function(){ 
alert("我又測試一下"); 
} 

}
</script> 

您可能感興趣的文章:

相關(guān)文章

前端顯示json格式化示例代碼
項目開發(fā)過程中遇到JSON字符串回顯的情況,直接顯示的話效果很丑,不方便查看,因此需要在前端頁面對JSON進行格式化顯示,下面這篇文章主要給大家介紹了關(guān)于前端顯示json格式化的相關(guān)資料,需要的朋友可以參考下
2024-03-03
JavaScript獲得指定對象大小的方法
這篇文章主要介紹了JavaScript獲得指定對象大小的方法,涉及javascript針對元素遍歷與屬性操作的相關(guān)技巧,需要的朋友可以參考下
2015-07-07
本地JS文件批量壓縮的操作方法
這篇文章主要介紹了本地JS文件批量壓縮的方法，由于之前壓縮的JS文件都比較少，都是手動壓縮的。這次需要壓縮的文件比較多，所以用了批量壓縮，特此記錄一下，方便大家和自己以后再用到的時候備忘
2022-12-12
Javascript動態(tài)伸縮+淡出淡入
一種不錯代碼應(yīng)用實例，大家可以根據(jù)這個代碼，拓寬出更好的代碼
2009-02-02
詳解在微信小程序的JS腳本中使用Promise來優(yōu)化函數(shù)處理
這篇文章主要介紹了詳解在微信小程序的JS腳本中使用Promise來優(yōu)化函數(shù)處理，引入Promise確實能夠很好的解決異步回調(diào)函數(shù)的可讀性等問題，同時也使得我們調(diào)用的時候代碼簡潔一些，本文介紹如何在小程序的JS代碼里面使用Promise來封裝一些函數(shù)的做法
2019-03-03
js判斷元素是否隱藏的方法
這篇文章主要介紹了js判斷元素是否隱藏的方法,需要的朋友可以參考下
2014-06-06
javascript根據(jù)像素點取位置示例
這篇文章主要介紹了javascript根據(jù)像素點取位置的示例，大家參考使用吧
2014-01-01
JS獲取瀏覽器版本及名稱實現(xiàn)函數(shù)
獲取瀏覽器名稱及版本信息,如果當(dāng)前瀏覽器是IE，彈出瀏覽器版本,否則彈出當(dāng)前瀏覽器名稱和版本，詳細(xì)實現(xiàn)代碼請參考本文
2013-04-04
解決LayUI數(shù)據(jù)表格復(fù)選框不居中顯示的問題
今天小編就為大家分享一篇解決LayUI數(shù)據(jù)表格復(fù)選框不居中顯示的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-09-09
JS實現(xiàn)回到頁面頂部動畫效果的簡單實例
下面小編就為大家?guī)硪黄狫S實現(xiàn)回到頁面頂部動畫效果的簡單實例。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-05-05