14/08/2018, 09:41
:checked Selector trong jquery
Checked Selector sẽ lựa chọn tất các phần tử đã được checked hoặc selected . Checked Selector sẽ hoạt động đối với các checkbox , nút radio và các tùy chọn của thẻ select . Nếu bạn muốn lấy riêng các tùy chọn đã được selected của thẻ select sử dụng :selected selector. ...
Checked Selector sẽ lựa chọn tất các phần tử đã được checked hoặc selected.
Checked Selector sẽ hoạt động đối với các checkbox, nút radio và các tùy chọn của thẻ select.
Nếu bạn muốn lấy riêng các tùy chọn đã được selected của thẻ select sử dụng :selected selector.
Cú pháp
Cú pháp
jQuery( ":checked" )
Ví dụ
Tìm kiếm tất cả các thẻ input có type=checkbox và đổi màu cho chúng:
Code
RUN
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>all demo</title>
<style>
textarea {
height: 35px;
}
div {
color: red;
}
fieldset {
margin: 0;
padding: 0;
border-awidth: 0;
}
.marked {
background-color: yellow;
border: 3px red solid;
}
</style>
<script src="https://code24h.com/cnd/js/jquery/jquery-3.2.1.min.js"></script>
</head>
<body>
<h1>Học lập trình miễn phí tại code24h.com</h1>
<form>
<p>
<input type="checkbox" name="newsletter" value="Hourly">
<input type="checkbox" name="newsletter" value="Daily">
<input type="checkbox" name="newsletter" value="Weekly">
<input type="checkbox" name="newsletter" value="Monthly">
<input type="checkbox" name="newsletter" value="Yearly">
</p>
</form>
<div id="result"></div>
<button onclick="myFunction()">Click vào đây để xem kết quả</button>
<script>
function myFunction(){
var countChecked = function() {
var n = $( "input:checked" ).length;
$( "#result" ).text("có phần " +n+" tử được chọn" );
};
countChecked();
$( "input[type=checkbox]" ).on( "click", countChecked );
}
</script>
</body>
</html>Kết quả:
Tham khảo: jquery.com
Các loại api khác
- jQuery Selector
- jQuery Events
Nguồn: code24h.com
