0

jQueryまたはJavaScriptを使用した画像検証に問題があります。

私が自分で試したときは、以下のコードを参照してください。

ブリーフィング

forループを使用して複数の画像を検証したいと思います。

問題（注文の検証）

送信ボタンを押すと、このコードはDESCの順序で画像を検証し（下の画像を参照1 field is required...） 、次のようなASCの順序が必要です2 field is required。

コード：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function imageValidation(){
    return_var = 'true';

    for(var i=1; i<4; i++){
        if(($('#player-'+i).val()) == ''){
            return_var = i+' field is required';
        }
    }
    alert(return_var);
    return false;

}   
</script>

<form onsubmit="return imageValidation()">
1 <input type="file" id="player-1" name="players[]" /><br />
2 <input type="file" id="player-2" name="players[]" /><br />
3 <input type="file" id="player-3" name="players[]" /><br />
<input type="submit" />
</form>

画像

ここに画像の説明を入力してください

4

2 に答える 2

1

break;最初の条件が一致したときに、新しいコード行を追加しました。それはあなたの問題を解決します 

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
function imageValidation(){
    return_var = 'true';

    for(var i=1; i<4; i++){
        if(($('#player-'+i).val()) == ''){
            return_var = i+' field is required';
            break;// break immediately rather wait to complete the loop.
        }
    }
    alert(return_var);
    return false;

}   
</script>

<form onsubmit="return imageValidation()">
1 <input type="file" id="player-1" name="players[]" /><br />
2 <input type="file" id="player-2" name="players[]" /><br />
3 <input type="file" id="player-3" name="players[]" /><br />
<input type="submit" />
</form>
于 2012-06-05T11:16:18.047 に答える
1

あなたのコードによると：

function imageValidation(){
    return_var = 'true';

    for(var i = 1; i < 4; i++){
        if(!$.trim( $('#player-'+i).val() )){
            return_var = i+' field is required';
            break;
        }
    }
    alert(return_var);
    return false;
}

しかし、jQueryでは

var return_var = 'true';
$('form input[id^=player]').each(function(index, el) {
  if(!$.trim( this.value)) {
    return_var += (index+1) + ' field is required'; // index is zero based
    break; // if you want to stop execution after invalid found
  }
});

したがって、関数は次のようになります

function imageValidation(){

   var return_var = 'true';
    $('form input[id^=player]').each(function(index, el) {
      if(!$.trim( this.value)) {
        return_var = (index+1) + ' field is required'; // index is zero based
        break; // if you want to stop execution after invalid found
      }
    });
    alert(return_var);
    return false;
}
于 2012-06-05T11:16:21.090 に答える