Question

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语句？

Answer 1

有效地使用jQuery，你可以这样做。

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

在此之前，我们需要以这种方式隐藏它们：

$('span.clr').hide();

Answer 2

你可以这样做：

   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();
   });

请注意

这意味着更严格一些，用“组织”替换“组织”
我试图模仿你的代码，但是在根处进行更改（即填充变量如name）将允许更简单的代码
如果您知道DOM没有改变且错误范围始终跟随输入，Praveen的答案可能更简单和适合

减少多个if else语句

2 个答案:

有效地使用jQuery，你可以这样做。