60个很实用的jQuery代码开发技巧收集

这个代码和上面类似，都属于帮助用户控制表单递交按钮。使用这段代码后，递交按钮只有在用户输入指定内容后才可以启动。

$('#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();

（编辑：温州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!