60个很实用的jQuery代码开发技巧收集
发布时间:2016-11-24 07:33:14 所属栏目:Linux 来源:站长网
导读:由于内容比较多建议用CTRL+F搜索 偶然在网上看到这些不错的jQuery代码开发技巧。原文收集了30个,另外查找的时候发现了还有20个。加上另外十个实用的jQuery代码片段,共60个代码技巧,收集在一起分享给大家。 1. 创建一个嵌套的过滤器 .filter(":not(:has(
|
这个代码和上面类似,都属于帮助用户控制表单递交按钮。使用这段代码后,递交按钮只有在用户输入指定内容后才可以启动。
$('#username').keyup(function() {
$('#submit').attr('disabled', !$('#username').val());
});
55: 禁止多次递交表单多次递交表单对于web应用来说是个比较头疼的问题,下面的代码能够很好的帮助你解决这个问题:
$(document).ready(function() {
$('form').submit(function() {
if(typeof jQuery.data(this, "disabledOnSubmit") == 'undefined') {
jQuery.data(this, "disabledOnSubmit", { submited: true });
$('input[type=submit], input[type=button]', this).each(function() {
$(this).attr("disabled", "disabled");
});
return true;
}
else
{
return false;
}
});
});
56: 高亮显示目前聚焦的输入框标示有时候你需要提示用户目前操作的输入框,你可以使用下面代码高亮显示标示:
$("form :input").focus(function() {
$("label[for='" + this.id + "']").addClass("labelfocus");
}).blur(function() {
$("label").removeClass("labelfocus");
});
57: 动态方式添加表单元素这个方法可以帮助你动态的添加表单中的元素,比如,input等:
//change event on password1 field to prompt new input
$('#password1').change(function() {
//dynamically create new input and insert after password1
$("#password1").append("lt;input type='text' name='password2' id='password2' /gt;");
});
58: 自动将数据导入selectbox中下面代码能够使用ajax数据自动生成选择框的内容
$(function(){
$("select#ctlJob").change(function(){
$.getJSON("/select.php",{id: $(this).val(), ajax: 'true'}, function(j){
var options = '';
for (var i = 0; i lt; j.length; i++) {
options += 'lt;option value="' + j[i].optionValue + '"gt;' + j[i].optionDisplay + 'lt;/optiongt;';
}
$("select#ctlPerson").html(options);
})
})
})
59: 判断一个复选框是否被选中代码很简单,如下:
$('#checkBox').attr('checked');
60: 使用代码来递交表单代码很简单,如下:
$("#myform").submit(); (编辑:宣城站长网) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |


