JavaScript Tutorial/jQuery/Form CheckBox
Содержание
30. Check the check box
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#single").val("Single2");
$("#multiple").val(["Multiple2", "Multiple3"]);
$("input").val(["check1","check2", "radio1" ]);
});
</script>
<style>
.selected { color:red; }
.highlight { background:yellow; }
</style>
</head>
<body>
<body>
<select id="single">
<option>1</option>
<option>2</option>
</select>
<select id="multiple" multiple="multiple">
<option selected="selected">Multiple</option>
<option>Multiple2</option>
<option selected="selected">Multiple3</option>
</select><br/>
<input type="checkbox" name="checkboxname" value="check1"/> check1
<input type="checkbox" name="checkboxname" value="check2"/> check2
<input type="radio" name="r" value="radio1"/> radio1
<input type="radio" name="r" value="radio2"/> radio2
</body>
</html>
30. Get checkbox from form controls
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var input = $("input:checkbox");
$("div").text(input.length);
});
</script>
</head>
<body>
<form>
<input type="checkbox" />
</form>
<div></div>
</body>
</html>
30. Get checked checkbox
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var n = $("input:checked").length;
$("div").text(n);
});
</script>
</head>
<body>
<form>
<input type="checkbox" name="newsletter" checked="checked" />
<input type="checkbox" name="newsletter" checked="checked"/>
</form>
<div></div>
<div>
</div>
</body>
</html>
30. Preset checkbox
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").val(["check1","check2", "radio1" ]);
});
</script>
</head>
<body>
<body>
<input type="checkbox" name="checkboxname" value="check1"/> check1
<input type="checkbox" name="checkboxname" value="check2"/> check2
<input type="radio" name="r" value="radio1"/> radio1
<input type="radio" name="r" value="radio2"/> radio2
</body>
</html>