1 通常网页上一个文本框中按回车,直接提交form表单 其实是触发了,提交按钮的focus ,同时触发单击事件
<input type="text" value=" 文本框" id="btn" />
<input type="button" value="弹出框" id="btn2" />
<script language="javascript" src="/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
//回车提交
$('#btn').keydown(function(e){
if(e.keyCode==13){
$('#btn2').focus();
}
});
$('#btn2').click(function(){
alert('触发按钮单击事件');
});
$('#btn2').focus(function(){
$('#btn2').val('触发按钮focus事件')
});
</script>
2 在输入框输入数据的时候 ,给用户焦点提示
.labelfocus{
color: #222;
font-weight: bold;
text-shadow: 0px 0px 5px #222;
}
<form id="form" action="">
<label for="search">Search: </label><input type="text" name="search" id="search" value="" />
<input type="submit" value="search" id="gbsearch" />
</form>
$(function(){
$("#form :input").focus(function() {
$("label[for='" + this.id + "']").addClass("labelfocus");
}).blur(function() {
$("label").removeClass("labelfocus");
});
});
3 select级联操作
$(function(){
$("#selectProvince").change(function(){
$.getJSON("/select.php",{id: $(this).val(), ajax: 'true'}, function(j){
var options = '';
for (var i = 0; i < j.length; i++) {
options += '<option value="' + j[i].optionValue + '">' + j[i].optionDisplay + '</option>';
}
$("#selectCity").html(options);
})
})
})
4 checkbox 操作 $(obj).attr("checked") jquery-1.9.1版本不支持$(obj).attr("checked") 1.4版本支持
<input type="checkbox" name="all" id="all" onclick="selectAll(this)"/>
<input type="checkbox" name="uids" value="2"/>
<input type="checkbox" name="uids" value="3"/>
<input type="checkbox" name="uids" value="4"/>
//全选
function selectAll( obj ){
if($(obj).attr("checked")){
$("input[name='uids']").attr("checked","true");
}else{
$("input[name='uids']").removeAttr("checked");;
}
}
获得所欲选中的checkbox对象
$('input[name="checkBoxNames"]:checked')