Rumah > hujung hadapan web > tutorial js > Kaedah Javascript untuk menyedari bahawa kotak input yang berkaitan menjadi kelabu dan tidak tersedia selepas memilih kotak semak_kemahiran javascript

Kaedah Javascript untuk menyedari bahawa kotak input yang berkaitan menjadi kelabu dan tidak tersedia selepas memilih kotak semak_kemahiran javascript

WBOY
Lepaskan: 2016-05-16 15:45:46
asal
1649 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara melaksanakan JavaScript untuk menjadikan kotak input yang berkaitan berwarna kelabu dan tidak tersedia selepas kotak semak dipilih. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Fungsi ini sering dilihat pada beberapa tapak web Jika anda memilih kotak semak, pilihan yang berkaitan akan dikelabukan dan tidak tersedia. Ia akan kelihatan lebih profesional dan juga merupakan cara untuk meningkatkan pengalaman pengguna.

Kesan operasi adalah seperti yang ditunjukkan di bawah:

Kod khusus adalah seperti berikut:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>选中复选框,相关类变灰</title>
<script language="JavaScript">
<!--
function selectKind(the){
var obj = the;
var container = document.getElementById("kind_" + obj.name);
for(var i=0;i<container.getElementsByTagName("input").length;i++)
{
container.getElementsByTagName("input")[i].disabled = obj.checked;
}
}
//-->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head>
<body>
<input type='checkbox' value="2" name=aa onclick="selectKind(this)">我从事游戏编程
<div id="kind_aa">
<input type='checkbox' value="php" name=aa>PHP 
<input type='checkbox' value="asp.net" name=aa>ASP.NET
<input type='checkbox' value="java" name=aa>JAVA
</div>
<input type='checkbox' value="1" name=bb onclick="selectKind(this)">平时不上网
<div id="kind_bb">
<input type='checkbox' value="baidu.com" name=bb>baidu.com 
<input type='checkbox' value="163.com" name=bb>163.com
<input type='checkbox' value="jb51.net" name=bb>jb51.net
</div>
</body>
</html>
Salin selepas log masuk

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

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan