1

実際、テキスト、選択、ドロップダウンなどのフィールドを持つフォームを検証しています。必須のフィールドがいくつかあり、それらに必須のクラスを指定しました（テキストフィールドのみ）。ここで、すべてのフォーム要素をループして、その要素に必要なクラスがあるかどうかを確認し、そのフィールドの後に * を追加します。each() メソッドを使用しましたが、思い通りに動作しません。

私のコードは次のようになります。

function validate_form() {
    $("#mysubmit").each(function() {
        if($("form :text.required:text").val() == "" )
        {
            $("form :text.required:text").html("*");
            return false;
        }
        return true;
    });
}

mysubmit は送信ボタンの ID です。

DOM 要素を 1 つずつトラバースしたい。このフォームを検証する方法を教えてください。ありがとう

4

3 に答える 3

1

あなたが言ったように、あなたは「*」を追加したいと思います。あなたはそれを中に挿入しようとしていました。

class="validation"Do itlikethisでスパンを作成します。

function validate_form() {
    var valid = true;
    $('form .required:text').each(function(){
       var $spanVal = $(this).next(); //Try to get the validation message (who has '*')
       if ($(this).val()!="" && $spanVal.is("span.validation")){ //If text has value
           $spanVal.remove(); //remove the asterisk
       }else if($(this).val()==""){ //If text is empty           
           if(!$spanVal.is("span.validation")){ //Create a validation message if it doesn't exist
              $('<span class="validation">*</span>').insertAfter(this);
           }
           valid = false;
       } 
    });
    return valid;
}

お役に立てれば。乾杯。

于 2011-05-07T14:09:55.257 に答える
0

.after次のように、必要な要素の後に*を追加するために使用できます。

$('.required').after('<span>*</span>');

すべての必須フィールドを反復処理するには、次のようにします。

$(.required).each(function(){
    //do something with this
    //inside this function 'this' is in turn each of the selected elements
    alert($(this).val());
});

jQuery.eachは、適用される選択範囲内のすべての要素を繰り返し処理します。あなたの場合$("#mysubmit")はただ1つの要素です（私は送信ボタンを想定しています）。その必要はありません。
これがあなたのコードの書き直されたバージョンです：

function validate_form() {
    var valid = true;
    $('form .required').each(function(){
       if ($(this).val()==''){
         $(this).after('<span>*</span>');
         valid = false;
       }
    });
    return valid;
}

ノート：

  • $("#mysubmit").each関数内のロジックは送信ボタンに依存しないため、必要はありません。
  • 試したような関数から値を返すと、.each期待どおりに機能しません。false関数から戻る.eachと、単純に反復が停止します。
  • $（ "form：text.required：text"）は、期待どおり、1つだけでなく、クラスを持つすべてのテキストフィールドに一致します。.required
于 2011-05-07T11:20:12.327 に答える