masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > Tiga cara untuk menyahtanda radio button_jquery

Tiga cara untuk menyahtanda radio button_jquery

WBOY
Lepaskan： 2016-05-16 16:36:45
asal
1779 orang telah melayarinya

Artikel ini menyediakan tiga cara untuk menyahtanda radio Contoh kod adalah seperti berikut:

Artikel ini bergantung pada jQuery Kaedah pertama dan kedua dilaksanakan menggunakan jQuery, dan kaedah ketiga adalah berdasarkan JS dan DOM. 

<!DOCTYPE HTML> 
<html> 
<head> 
<title>单选按钮取消选中的三种方式</title> 
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"> 
</script> 
<script type="text/javascript"> 
$(function(){ 
// 
var $browsers = $("input[name=browser]"); 
var $cancel = $("#cancel"); 
var $byhide = $("#byhide"); 
var $remove = $("#remove"); 
// 
$cancel.click(function(e){ 
// 移除属性,两种方式都可 
//$browsers.removeAttr("checked"); 
$browsers.attr("checked",false); 
}); 
// 
$byhide.click(function(e){ 
// 切换到一个隐藏域,两种方式均可 
//$("#hidebrowser").attr("checked",true); 
$("#hidebrowser").attr("checked","checked"); 
}); 
// 
$remove.click(function(e){ 
// 直接去的DOM元素,移除属性 
// 如果不使用jQuery,则可以移植此方式 
var checkedbrowser=document.getElementsByName("browser"); 
/* 
$.each(checkedbrowser, function(i,v){ 
v.checked = false; 
v.removeAttribute("checked"); 
}); 
*/ 
// 
var len = checkedbrowser.length; 
var i = 0; 
for(; i < len; i++){ 
// 必须先赋值为false,再移除属性 
checkedbrowser[i].checked = false; 
// 不移除属性也可以 
//checkedbrowser[i].removeAttribute("checked"); 
} 

}); 
}); 
</script> 
</head> 
<body> 
<p>您喜欢哪款浏览器？</p> 

<form> 
<input style="display:none;" id="hidebrowser" type="radio" name="browser" value=""> 
<input type="radio" name="browser" value="Internet Explorer">Internet Explorer<br /> 
<input type="radio" name="browser" value="Firefox">Firefox<br /> 
<input type="radio" name="browser" value="Netscape">Netscape<br /> 
<input type="radio" name="browser" value="Opera">Opera<br /> 
<br /> 
<input type="button" id="cancel" value="取消选中方式1" size="20"> 
<input type="button" id="byhide" value="取消选中方式2" size="20"> 
<input type="button" id="remove" value="取消选中方式3" size="20"> 
</form> 

</body> 
</html>
Salin selepas log masuk
Label berkaitan：
Radio butang radio
sumber：php.cn
Artikel sebelumnya：Tentukan fungsi asli dalam JavaScript untuk menyemak sama ada fungsi itu ialah kemahiran code_javascript asli Artikel seterusnya：javascipt: pengenalan penapis dan kemahiran use_javascript
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
Artikel terbaru oleh pengarang
Isu terkini
Bagaimana untuk memilih berbilang kotak pilihan dalam Reactjs Saya mempunyai senarai pilihan di mana saya ingin memilih berbilang kotak pilihan tetapi t...
daripada 2024-04-06 18:55:21
0
1
396
Buka dokumen pengiraan menggunakan window.open() dan data: skema Saya mempunyai halaman web yang berjalan dalam penyemak imbas yang menjana dokumen HTML te...
daripada 2024-04-06 15:06:34
0
1
378
Penapis ungkapan biasa untuk kotak carian dan kotak semak tindanan MERN Saya cuba memahami cara tindanan MERN berfungsi bersama-sama dengan belajar dengan melakuk...
daripada 2024-04-06 14:53:12
0
1
425
Cara mencetak nilai kotak pilihan yang dipilih selepas penyerahan Ini ialah senarai kotak pilihan saya dan butang yang saya perlukan untuk menyerahkan data....
daripada 2024-04-06 13:07:43
0
2
337
PHPMailer menggunakan gmail dan XOAUTH2: Bagaimana untuk mendapatkan token penyegaran baharu secara automatik apabila token penyegaran semasa tamat tempoh? Saya bimbang tentang menggunakan Gmail dengan XOAUTH2 (PHPMailerWiki) dan Bagaimana untuk ...
daripada 2024-04-06 10:14:45
0
1
373
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan