JQuery, как очистить все входные данные: текстовые поля .class на форме.Не работает для меня - PullRequest
5 голосов
/ 08 ноября 2011

У меня есть форма, первый .class имеет 5 входных: текстовые поля в нем.Я хочу иметь возможность очистить все текстовые поля одним нажатием кнопки.Я пробовал это несколькими способами, и это не работает ... вот что я сделал .... (К вашему сведению, у меня есть больше классов в форме, поэтому я не могу использовать .reset.

Форма ...

<table class="orderLine1 formFont" width="900">
 <tr>
    <td width="395">Product Name:<br><input class="ProductName" type="text" size="65"></td>
    <td width="97" class="formFontDisabled">Prod ID:<br><input class="Product_ID ffd" type="text" size="5" disabled></td>
    <td width="78" class="formFontDisabled">UPC:<br><input class="UPC ffd" type="text" size="13" disabled ></td>
    <td width="67" class="formFontDisabled">List Price:<br><input class="ListPrice ffd" type="text" size="7" disabled></td>    
    <td width="67">WholeSale:<br><input class="WholeSalePrice ffd" type="text" size="7" disabled></td>
    <td width="56">Quantity:<br><input class="qty addLine" type="text" size="7"></td>
    <td width="60" class="formFontDisabled">Line Total:<br><input class="subTotal ffd" type="text" size="10" disabled></td>
    <td width="44"><button class="OFDeleteButton">Delete</button><button class="OFClearLine" >OFClearLine</button></td>
  </tr>
</table>

Тест скриптов # 1

   $(document).ready(function(e) {
    $(function clearFirst() {
         $('.orderLine1').find(':input').each(function() {
             switch(this.type) {
                 case 'text':
                    $(this).val('');
                    break;
                 }
             });
        });

    $('.OFClearLine').click(function(e) {
        clearFirst();
    });
    });

Тест скриптов # 2

  $(function(){
        $('.OFClearLine').bind('click', function(){
            $('.orderLine1').reset();
        });
    });

Подробнее: OFClearLine - класс длякнопка, которую я хочу использовать, & orderLine1 - это класс формы.

Заранее спасибо!

Ответы [ 5 ]

20 голосов
/ 08 ноября 2011
$(function() {
  $('.OFClearLine').click(function() {
    $('.orderLine1 input[type="text"]').val('');
  });
});
7 голосов
/ 08 ноября 2011

Как-то так должно работать:

$("input.className:text").val("");

Глядя на ваш код, это может работать лучше:

$(".className input[type='text']").val("");

Вот jsFiddle: http://jsfiddle.net/nvUsD/1/

1 голос
/ 08 ноября 2011

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

0 голосов
/ 08 ноября 2011

Попробуйте:

$(document).ready(function(e) {
    $('.OFClearLine').click(function(e) {
        $('.orderLine1 input:text').each(function() {
                $(this).val('');
        });
    });
});

Вы можете увидеть это в действии на этой скрипке, http://jsfiddle.net/nickyt/exWKL

0 голосов
/ 08 ноября 2011

Я не уверен, что он может видеть вашу функцию clearFirst. Также вы можете просто использовать $ ('. OrderLine1 input'), чтобы найти все входные данные в классе .orderLine1.

$(document).ready(function(e) {    
    $('.OFClearLine').click(function(e) {
        clearFirst();
    });
});

function clearFirst() {
    $('.orderLine1 input[type="text"]').each(function() {
         $(this).val('');
    });
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...