cari

Rumah >hujung hadapan web >tutorial js >Cara memautkan kotak pilihan juntai bawah js dan kotak input untuk menambah nilai yang dipilih pada kotak input kemahiran_javascript

Cara memautkan kotak pilihan juntai bawah js dan kotak input untuk menambah nilai yang dipilih pada kotak input kemahiran_javascript

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBasal
2016-05-16 15:44:411834semak imbas

Contoh dalam artikel ini menerangkan kaedah memautkan kotak pilihan juntai bawah js dan kotak input untuk menambah nilai yang dipilih pada kotak input. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Berikut ialah demonstrasi kaitan antara kotak pilihan lungsur turun js dan kotak input, dan kesan penambahan terus nilai yang dipilih pada kotak input. Saya percaya ramai rakan telah melihat kesan ini. Ia menjimatkan masalah input kepada pengguna Di sini, JS digunakan untuk memberikan nilai secara langsung kepada kotak input Selepas memahami prinsip, ia boleh digunakan secara fleksibel untuk mengembangkan lebih banyak kesan khas.

Tangkapan skrin yang sedang berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

http://demo.jb51.net/js/2015/js-select-value-to-input-codes/

Kod khusus adalah seperti berikut: 

<html>
<head>
<title>下拉选择框与输入框联动，直接添加选中值到输入框</title>
</head>
<body>
<select id="uiSel">
  <option value="-1">请选择</option>
  <option value="until1">unti1</option>
  <option value="until2">unti2</option>
  <option value="until3">unti3</option>
  <option value="until4">unti4</option>
  <option value="until5">unti5</option>
</select>
<input type="text" name="" id="show" />
</body>
<script type="text/javascript">
document.getElementById('uiSel').onchange=function (){
  if(this.options[0].value==-1)this.options[0]=null;
  document.getElementById('show').value=this.value
};
</script>
</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：Pelaksanaan JS kemahiran perkongsian kod_javascript masa kira detik boleh larasArtikel seterusnya：Pelaksanaan JS kemahiran perkongsian kod_javascript masa kira detik boleh laras

Artikel berkaitan

Lihat lagi