دکمه انتخاب همه گزینه ها (checkboxes) یا عدم انتخاب همه گزینه ها (با javascript)
با این کد، می توانیم یک دکمه بسازیم که برای انتخاب همه گزینه ها یا عدم انتخاب همه گزینه ها به کار رود. کاربر می تواند یک یا چند گزینه را انتخاب کند، ولی زمانی که قصد دارد که همه گزینه ها انتخاب شوند و یا از حالت انتخاب در بیایند، می تواند از این دکمه استفاده کند. نمونه آن در زیر نمایش داده شده است :
کدها :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript">
var checkflag = "false";
function check(field) {
if (checkflag == "false") {
for (i = 0; i < field.length; i++) {
field[i].checked = true;}
checkflag = "true";
return "Uncheck All"; }
else {
for (i = 0; i < field.length; i++) {
field[i].checked = false; }
checkflag = "false";
return "Check All"; }
}
</script>
</head>
<body>
<center>
<form name="myform" action="" method="post">
<table>
<tr><td>
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">JavaScript<br>
<input type="checkbox" name="list" value="3">ASP<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>
<br>
<input type="button" value="Check All" onClick="this.value=check(this.form.list)">
</td></tr>
</table>
</form>
</center>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript">
var checkflag = "false";
function check(field) {
if (checkflag == "false") {
for (i = 0; i < field.length; i++) {
field[i].checked = true;}
checkflag = "true";
return "Uncheck All"; }
else {
for (i = 0; i < field.length; i++) {
field[i].checked = false; }
checkflag = "false";
return "Check All"; }
}
</script>
</head>
<body>
<center>
<form name="myform" action="" method="post">
<table>
<tr><td>
<b>Your Favorite Scripts & Languages</b><br>
<input type="checkbox" name="list" value="1">Java<br>
<input type="checkbox" name="list" value="2">JavaScript<br>
<input type="checkbox" name="list" value="3">ASP<br>
<input type="checkbox" name="list" value="4">HTML<br>
<input type="checkbox" name="list" value="5">SQL<br>
<br>
<input type="button" value="Check All" onClick="this.value=check(this.form.list)">
</td></tr>
</table>
</form>
</center>
</body>
</html>
دسته بندی
کدهای آماده برای فرم ها
نظرات 0 0 0