cari

Rumah >hujung hadapan web >tutorial js >Kaedah JavaScript untuk menambah data tatasusunan ke Kemahiran kotak lungsur Pilih_javascript

Kaedah JavaScript untuk menambah data tatasusunan ke Kemahiran kotak lungsur Pilih_javascript

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBasal
2016-05-16 15:43:432535semak imbas

Contoh dalam artikel ini menerangkan cara menambahkan data tatasusunan pada kotak lungsur Pilih menggunakan JavaScript. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Berikut ialah demonstrasi kesan penambahan data dalam tatasusunan ke menu lungsur Pilih Apabila anda mengklik kotak lungsur, data dimuatkan secara dinamik Apabila menukar kandungan Pilih, cuma gantikan kandungan tatasusunan secara langsung. Ia sesuai untuk pereka bahagian hadapan untuk melaksanakan beberapa operasi skrip setempat di bahagian hadapan.

Tangkapan skrin kesan berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

http://demo.jb51.net/js/2015/js-array-add-select-data-codes/

Kod khusus adalah seperti berikut: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>将数组中的数据添加到下拉菜单中</title>
<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>
<script type="text/javascript">
var counts;
counts=0;
arr = new Array("JavaScript与ASP","JavaScript与JSP","JavaScript与ASP.NET","JavaScript与PHP"); 
counts=arr.length;
function Myselect(){
 var i;
 for (i=0;i < counts; i++) {
 document.form1.sel.options[i] = new Option(arr[i],i);
 }
}
</script>
</head>
<body>
<table width="280" height="160" border="0" align="center" cellpadding="5" cellspacing="0">
 <tr>
 <td height="34" align="center"><span class="style1" style="font-weight:bold ">将数组中的数据添加到下拉菜单中</span></td>
 </tr>
 <tr>
 <td align="center" valign="top" bgcolor="#9ACCFF"><form name="form1">
  <table width="235" height="69" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
   <td height="21"><select name="sel" id="sel" onFocus="Myselect()">
   </select></td>
  </tr>
  <tr>
   <td height="120"> </td>
  </tr>
  </table>
 </form></td>
 </tr>
</table>
</body>
</html>

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Perkongsian kod menu dinamik untuk kemahiran effect_javascript menaip JSArtikel seterusnya：Perkongsian kod menu dinamik untuk kemahiran effect_javascript menaip JS

Artikel berkaitan

Lihat lagi