jquery获取所有输入表单元素,包括无线电

时间:2015-04-17 09:58:43

标签: jquery html

我正在尝试通知用户他们是否离开了表单页面中未保存的更改。

使用以下脚本,我成功检索了所有输入字段,除非无线电字段已更改。

我怎样才能获得无线电领域?

的jQuery

$(':input').each(function() { 
$(this).data('initialValue', $(this).val()); 
}); 

window.onbeforeunload = function(){ 
    var msg = 'Unsaved data presence'; 
    var isDirty = false; 

    $(':input').each(function () { 
        if($(this).data('initialValue') != $(this).val()){ 
            isDirty = true; 
        } 
    }); 

    if(isDirty == true){ 
        return msg; 
    } 
}; 

HTML

...
<fieldset class="radio btn-group btn-group-yesno" id="jform_params_admin">
    <input type="radio" checked="checked" value="1" name="jform[params][admin]" id="jform_params_admin0">
    <input type="radio" value="0" name="jform[params][admin]" id="jform_params_admin1">
    <label for="jform_params_admin1" class="btn">No</label>
</fieldset>
<input type="text" size="40" class="inputbox" value="text" id="jform_params_text" name="jform[params][admin_text]">
...

1 个答案:

答案 0 :(得分:2)

修改

1.删除initialValue因为你不需要它。

2.您可以使用以下未经测试的代码:

window.onbeforeunload = function(){ 
  var msg = 'Unsaved data presence'; 
  var isDirty = false; 

  $(':input').each(function () {
    var $e = $(this);
    if(($e.is(':checkbox') || $e.is(':radio')) && $e.prop('defaultChecked') != $e.prop('checked')) {
      isDirty = true;
    } else if($e.prop('defaultValue') != $e.val()) {
      isDirty = true;
    }
  }); 

  if(isDirty == true){ 
      return msg; 
  } 
};

<强> OLD

检查输入是否改变的代码是完全错误的。问题是当您选中复选框/ radoi时,收音机和复选框不会更改value。他们更改了checked属性。您可以通过为复选框/无线电添加一些不同的代码来修复它:

$(':input').each(function() { 
  $(this).data('initialValue', $(this).val()); 
}); 

$(':radio').each(function() { 
  $(this).data('initialValue', $(this).checked()); 
}); 

以后:

$(':input').each(function () {
    if($(this).data('initialValue') != $(this).val() || $(this).data('initialValue') != $(this).checked()){ 
        isDirty = true; 
    }
});