HTML and CSS Reference
In-Depth Information
case "C":
$("#GridView1 tr a[href *= 'products/']").parent().css("display", "none");
$("#GridView1 tr a[href |= 'Paper']").parent().css("display", "none");
$("#GridView1 tr a[href $= '-comp.zip']").parent().css("display", "block");
break;
Selecting Form Elements
Form selectors let you select HTML
<form>
elements based on their type (text box, check box, radio button,
and so on) or their status (selected, checked, or disabled). Table 2-5 lists the various form selectors
available.
Table 2-5.
Form Selectors
Selector
Elements Selected
:button
<input>
elements of type
button
, and
<button>
elements
:checkbox
<input>
elements of type
checkbox
:checked
Check boxes and radio buttons that are checked
:disabled
Elements that are disabled
:enabled
Elements that are enabled
file
<input>
elements of type
ile
:image
<input>
elements of type
image
:input
Elements of type
<input>
,
<textarea>
,
<select>
, and
<button>
:password
<input>
elements of type
password
:radio
<input>
elements of type
radio
:reset
<input>
elements of type
reset
:selected
Options of a
<select>
element that are selected
:submit
<input>
elements of type
submit
:text
<input>
elements of type
text
Listing 2-9 shows some of the selectors mentioned in Table 2-5.
Listing 2-9.
Basic Usage Syntax of Form Selectors
$(document).ready(function () {
$("#form1 :text").attr("disabled", "disabled");
$("#form1 :checkbox").attr("checked", "checked");
$("#Button1").click(function () {
alert($("#form1 input[type='checkbox']:checked").length + " checkboxes are checked.");
alert($("#Select1 option:selected").length + " options are selected.");
});
});
The first form selector in Listing 2-9 selects all text boxes and disables them by adding the
disabled
attribute. The jQuery
attr()
function is used to set attribute values of an element. The first parameter of
attr()
is the name of the attribute, and the second parameter is its value. In this case, the
disabled
attribute is set to a value of
disabled
so as to disable the text boxes.
