Question

我有一个包含很多字段的表单，并希望在我最好使用jQuery单击按钮时清除输入[type = text]的所有默认值（未更改的值）。我正在使用按钮而不是提交，因为我将使用相同的按钮然后将表单提交到本地脚本，然后再提交到第三部分进行处理。但是我的脚本似乎没有用。

表单的简化版本：

<form name="cpdonate" id="cpdonate" method="post" action="" >
  <input type="text" value="First Name" id="BillingFirstName" name="BillingFirstName" onFocus="clearField(this)" onBlur="setField(this)" />
  <input type="text" value="Last Name" id="BillingLastName" name="BillingLastName" onFocus="clearField(this)" onBlur="setField(this)" />
  <input type="hidden" name="Submit" value="Submit" />
  <button id="cpbutton">Submit</button>
</form>

和我正在使用的脚本：

<script type="text/javascript">
$(document).ready(function(){
  // default values will live here
  var defaults = {};

  // Set the default value of each input
  $('input[type=text]').each(function(){
      defaults[$(this).attr('value')] = $(this).text();
  });

  // Functions to perform on click
  $('#cpbutton').click(function(){
      // clear unchanged values
      $('input[type=text]').each(function(){
        if (defaults[$(this).attr('value')] === $(this).text())
          $(this).text('');
      });
  });
});
</script>

Answer 1

input没有文本，它有价值，一旦用户更改它就不能依赖该属性，需要从value属性中获取它。此外，如果更改了值，则defaults对象将无法找到该值。

我将使用data()

将每个值存储在元素本身上

使用val()

$(document).ready(function(){


  // Set the default value of each input
  $('input[type=text]').each(function(){
     $(this).data('val', $(this).val());
  });

  // Functions to perform on click
  $('#cpbutton').click(function(){
      // clear unchanged values
      $('input[type=text]').each(function(){
        if ($(this).data('val') === $(this).val())
          $(this).val('');
      });
  });
});

Answer 2

您可以尝试此操作（Example）

// clear unchanged values
$('input[type=text]').each(function(){
    if ($(this).val() == this.defaultValue) $(this).val('');
});

input type=text具有.val() jQuery方法，而不是text()并使用this.defaultValue来检查初始默认值。

Answer 3

您应该使用默认值[$（this）.attr（'name'）]而不是默认值[$（this）.attr（'value'）]，因为当用户更改值时，属性“值”值也会更改< / p>

在发送之前，在按钮单击时清除多个输入[type = text]默认值

3 个答案: