Как очистить все поля ввода в конкретном div с помощью jQuery?

Ответ 1

Fiddle: http://jsfiddle.net/simple/BdQvp/

Вы можете сделать это так:

Я добавил две кнопки в Fiddle, чтобы проиллюстрировать, как вы можете вставлять или очищать значения в этих полях ввода через кнопки. Вы просто захватываете событие onClick и вызываете функцию.

//Fires when the Document Loads, clears all input fields
$(document).ready(function() {
  $('.fetch_results').find('input:text').val('');    
});

//Custom Functions that you can call
function resetAllValues() {
  $('.fetch_results').find('input:text').val('');
}

function addSomeValues() {
  $('.fetch_results').find('input:text').val('Lala.');
}

Update:

Посмотрите этот отличный ответ ниже Beena, а также для более универсального подхода.

Ответ 2

Эта функция используется для очистки всех элементов формы, включая переключатель, флажок, выбор, множественный выбор, пароль, текст, текстовое поле, файл.

function clear_form_elements(class_name) {
  jQuery("."+class_name).find(':input').each(function() {
    switch(this.type) {
        case 'password':
        case 'text':
        case 'textarea':
        case 'file':
        case 'select-one':
        case 'select-multiple':
        case 'date':
        case 'number':
        case 'tel':
        case 'email':
            jQuery(this).val('');
            break;
        case 'checkbox':
        case 'radio':
            this.checked = false;
            break;
    }
  });
}

Ответ 3

вдохновлен fooobar.com/questions/155199/..., но я использую селектор вместо класса и предпочитаю, если переключатель:

function clearAllInputs(selector) {
  $(selector).find(':input').each(function() {
    if(this.type == 'submit'){
          //do nothing
      }
      else if(this.type == 'checkbox' || this.type == 'radio') {
        this.checked = false;
      }
      else if(this.type == 'file'){
        var control = $(this);
        control.replaceWith( control = control.clone( true ) );
      }else{
        $(this).val('');
      }
   });
}

это должно заботиться почти обо всех входах внутри любого селектора.

Ответ 4

Измените это:

 <div class=fetch_results>

К этому:

 <div id="fetch_results">

Затем должно работать следующее:

$("#fetch_results input").each(function() {
      this.value = "";
  })​

http://jsfiddle.net/NVqeR/

Ответ 5

Пара проблем, которые я вижу. fetch_results - это класс, а не идентификатор, и каждая функция не выглядит правильно.

$('.fetch_results:input').each(function() {
      $(this).val('');
});

Просто помните, что если вы закончите с помощью радиостанций или кнопок проверки, вам придется очистить проверенный атрибут, а не значение.

Ответ 6

Если вы хотите остаться с селектором уровня, тогда вы можете сделать что-то подобное (используя тот же jfiddle от Mahn)

$("div.fetch_results input:text").each(function() {
  this.value = "testing";
})​

Это будет выбирать только поля ввода текста в div с классом fetch_results.

Как и в любом jQuery, это единственный способ сделать это. Задайте 10 jQuery людям этот вопрос, и вы получите 12 ответов.

Ответ 7

$.each($('.fetch_results input'), function(idx, input){
  $(input).val('');
});

Ответ 8

Просто нужно было удалить все входы внутри div и использовать двоеточие перед входом, когда таргетинг получает почти все.

$('#divId').find(':input').val('');

Ответ 9

Для тех, кто хочет сбросить форму, можно также использовать type="reset" внутри любой формы.

<form action="/action_page.php">
Email: <input type="text" name="email"><br>
Pin: <input type="text" name="pin" maxlength="4"><br>
<input type="reset" value="Reset">
<input type="submit" value="Submit">
</form>