<script type="text/javascript" src="<%=basePath%>common/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
//jquery获得对象的两种方式
function getObj(){
var valByName = $("input[name='namej']").val();
alert(valByName+' byName');
var valById = $("#idj").val();
alert(valById+' byId');
}
//禁用、启用 attr
function noObj(){
var diabledVal = $("input[name='namej']").attr("disabled");
if(diabledVal){
$("input[name='namej']").attr("disabled",false);
}else{
$("input[name='namej']").attr("disabled",true);
}
}
//测试select
function testSelect(){
var selectVal = $("select[name='selectName']").val();
if(selectVal == '1'){
$("#man").attr("checked",true);
//$("#woman").attr("checked",false);
}else if(selectVal == '0'){
//$("#man").attr("checked",false);
$("#woman").attr("checked",true);
}
}
//全选
function checkAll(){
var checks = $("input[name='like']");
$.each(checks,function(){
$(this).attr("checked",true);
});
}
//反选
function checkOpp(){
var checks = $("input[name='like']");
$.each(checks,function(){
if($(this).attr("checked")){
$(this).attr("checked",false);
}else{
$(this).attr("checked",true);
}
});
}
</script>
</head>
<body>
<input type="text" name="namej" id="idj" value="hello" />
<input type="button" onclick="getObj()" value="显示对象值">
<input type="button" onclick="noObj()" value="禁用/启用input">
<hr/>
<select name="selectName" id="selectId" onchange="testSelect();">
<option value="">请选择选项</option>
<option value="1">男</option>
<option value="0">女</option>
</select>
<input type="radio" id="man" name="sex" value='1' />男<input type="radio" id="woman" name="sex" value='0'/>女
<hr/>
<input type="checkbox" name="like" value="lq"/> 篮球
<input type="checkbox" name="like" value="zq"/> 足球
<input type="checkbox" name="like" value="ppq" /> 乒乓球
<input type="button" onclick="checkAll();" value="全选">
<input type="button" onclick="checkOpp();" value="反选">
</body>
=========================================================================================
一、获得dom 元素(选择器)
1 $("#id") <input id = 'id' /> $("#id")
2 $(.class) <input class='sheet' /> $(".sheet")
3 $([attribute=value]) <input name="name" /> $("input[name='name']")
$("") ""内的内容是jquery 的选择器 selector
4 $(:checked) <input type="checkbox" value="aa" /> $("input[type='checkbox']:checked")
:checked 筛选器适用于 checkbox 和 radio
5 $(:selected) <select name="like"><option selected value="1" >篮球</option></select> $("select[name='like'] option:selected")
:selected 筛选器 适用于select
二:属性函数
.attr(key,value);
.html(value);
.val(value);
.removeAttr(name);
三:文档处理函数
.append(content); 附加html或者text 信息
.empty(); 清空元素内信息
.remove (); 移除元素
.replaceWith(html);将制定元素用html 替换