Очистить множественные значения ввода [type = text] по умолчанию при нажатии кнопки перед отправкой

0

У меня есть форма с большим количеством полей и я хочу удалить все значения по умолчанию (неизменные) для ввода [type = text], когда я нажимаю кнопку, предпочтительно используя jQuery. Я использую кнопку, а не отправлю, потому что я буду использовать ту же кнопку, чтобы отправить форму на локальный скрипт, а затем на третью часть для обработки. Но мой сценарий, похоже, не работает.

Упрощенная версия формы:

<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>
  • 0
    используйте .val () вместо .text () для получения / установки значений текстового поля
  • 0
    Какие браузеры вы хотите поддерживать? Вы можете использовать атрибут placeholder для новых браузеров (не поддерживается ниже IE10 ) jsfiddle.net/h4hGP
Теги:
forms
input

3 ответа

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('');
      });
  });
});
Поделиться
  • 0
    Есть ли способ установить значение по умолчанию для каждого входа только в первый раз? Таким образом, когда третья сторона перенаправляет обратно с ошибкой, я могу снова заполнить поля данными публикации, и им нужно будет только внести исправления, а не вводить заново все. В настоящее время после перенаправления он использует новые данные поста по умолчанию и очистит их, если они не изменятся.
0

Вы должны использовать defaults [$ (this).attr('name')] вместо defaults [$ (this).attr('value')], потому что когда пользователь меняет значение, значение атрибута "values" также изменяется

Поделиться
0

Вы можете попробовать это (пример)

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

input type=text имеет .val() jQuery, а не text() и используйте this.defaultValue чтобы проверить начальное значение по умолчанию.

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню