1

入力フィールドに必須の属性があるかどうかを確認したいと考えています。これらのフィールドに空の値があり、必要な属性もある場合は、各フィールドの後にエラー div を追加します。セレクターの使い方に少し戸惑いました

 // initialize validator for a bunch of input fields
 var inputs = $("#Contact :input")

 // Check all required fields
 if (inputs.attr("required") && inputs.val() === "") {
    var invalidFields = Select all fields that have the attribute required and an empty value, and assign them a class
     alert("Required Fields not completed"); 
 }
4

4 に答える 4

2

各要素をループすることでそれを行う必要があります

$("#Contact :input [required]").each(function(){
if($(this).val()===""){
//the input doesn't have a value, but is required
//code here
}
});
于 2012-04-06T01:38:16.533 に答える
0

このようなことを試して、基準を満たすすべての入力にクラスを追加する必要があります

  $("#Contact :input").each(function(){
         if ($(this).attr("required") && $(this).val() === "") 
         {
        $(this).addClass("req");

         }
      });
于 2012-04-06T01:31:46.427 に答える
0

これを試してください：http://jsfiddle.net/aramk/mK8YL/

HTML:

<input id="some" class="required" name="some" type="text" value="" />
<input id="submit_btn" type="submit" value="Go!" />

JS:

$(document).ready(function() {

    $('#submit_btn').click(function() {
        // initialize validator for a bunch of input fields
        var valid = true;
        var inputs = $("input.required").each(function() {
            var input = $(this);
            // Check all required fields
             if (input.val() === '') {
                input.addClass('invalid');
                valid = false; // Avoid a submit
                alert("Required Fields not completed"); 
             } else if (input.hasClass('invalid')) {
                 input.removeClass('invalid');
             }
        });
        if (valid) {
            // This will submit
            alert('submit successful');
        } else {
            return false;
        }
    });

}
);
​

CSS:

.required {
    background: yellow;
    color: black;
}

.invalid {
    background: red;
    color: white;
}​

これらの入力を送信用のフォームに必ず追加してください。

于 2012-04-06T01:36:00.573 に答える
0

このfilter関数をコールバックで使用して、選択した要素を不足している必要な要素に絞り込むことができます。

var inputs = $("#Contact :input");

var missing = inputs.filter(function() {
   return this.getAttribute("required") && this.value === "";
});
于 2012-04-06T01:29:28.140 に答える