2
My Name:<input class="clr" id="name" type="text" /><span class="clr" id="name_error">Name is required</span> <br /><br />

My Email Adress:<input class="clr" id="email" type="text" /><span class="clr" id="email_error">Email is required</span> <br /><br />

My Organisation Name:<input class="clr" id="organisation" type="text" /><span class="clr" id="org_error">Organisation is required</span> <br /><br />

3つの入力フィールドがあります。span空のフィールドを送信するときにエラーメッセージを表示するために使用しています。

私の問題は、nameフィールドが空の場合は"Name is required"エラーが発生し、emailフィールドが空の場合はエラーが発生するということ"email is required"です。

このために、私は以下のコードを書いています。

if (name == "")
    $("#name_error").show();
else
    $("#name_error").hide();

if (email == "")
    $("#email_error").show();
else
    $("#email_error").hide();

if (organisation == "")
    $("#org_error").show();
else
    $("#org_error").hide();

if / elseステートメントを減らす方法はありますか?

4

2 に答える 2

10

jQuery を効果的に使用すると、このようにすることができます。

$('input.clr').each(function(){
    if ($(this).val() == "")
        $(this).next('span.clr').show();
});

その前に、次の方法でそれらを非表示にする必要があります。

$('span.clr').hide();
于 2013-03-04T14:22:05.713 に答える
3

あなたはこれを行うことができます:

   var obj = window; // or something else, depending on your scope
   ['name', 'email', 'organisation'].forEach(function(v) {
       var $e = $('#'+v+'_error');
       if (obj[v]=="") $e.show();
       else $e.hide();
   });

ご了承ください

  • これは、"org" を "organisation" に置き換えて、もう少し厳密にすることを想定しています。
  • 私はあなたのコードを模倣しようとしましたが、ルート (つまり、変数を入力する場所name) を変更すると、より単純なコードが可能になります
  • DOMが変更されず、エラースパンが常に入力に従うことがわかっている場合、Praveenの答えはおそらくよりシンプルで適しています
于 2013-03-04T14:21:45.040 に答える