我如何关注所有值为空的类字段？答案

【问题标题】：How can i focus all class fields whose value is empty?我如何关注所有值为空的类字段？
【发布时间】：2017-06-09 05:17:13
【问题描述】：

<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="3"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4">

如何聚焦所有值为空的类字段？

var skillname =$(".searchskill").map(function() {
  if($(this).val()==''){
      return false;
   }
}).get();

if(jQuery.isEmptyObject(skillname)){
} else {
    alert("You Can Not Keep Skill Name As Blank"); 
    $(".searchskill").css({"border-style": "solid", "border-color": "red"});
    $(".searchskill").focus();
    return false;
}

我只想关注那些空的......我该如何解决这个问题？

【问题讨论】：

你知道你一次只能关注一个领域，对吧？

标签： javascript jquery validation array.prototype.map

【解决方案1】：

使用.filter() 获取所有值为空的文本框，而不是其他的东西请找到如下的sn-ps

$(".clssubmit").on("click", function() {
  var filteredList = $('.searchskill').filter(function() {
    return $(this).val() == "";
  });
  if (filteredList.length > 0) {
    filteredList.css("border", "1px solid red");
    return false;
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="searchskill" value="">
<input type="text" class="searchskill" value="3">
<input type="text" class="searchskill" value="">
<input type="text" class="searchskill" value="4">

<input type="button" value="submit" class="clssubmit" />

【讨论】：

那里有很多输入文本。除此之外
我已经更新了我的答案，只需在你必须关注的输入上应用相同的类
我必须在哪里写reurn false..？
@AbdulWaheed 我更新了我的 sn-p 请看一下

【解决方案2】：

假设你使用的是 jQuery；

var $inputs = $(".searchskill");
 for (let i = 0, iLen = $inputs.length; i < iLen; i++) {
       var $elem = $($inputs[i]);
       if($elem.val()===""){
       $elem.parent("div").addClass("border-red alert-danger");
       $elem.focus();
       }
    }

【讨论】：

【解决方案3】：

 $(".searchskill").each(function() {
    if($(this).val() === "") {
        $(this).css({"border-style": "solid", "border-color": "red"});
    }
});

【讨论】：

在没有返回值的情况下使用.map 只是在浪费一个特性。请改用.each
@Rajesh 我已经编辑了我的帖子，但我不能让你感到抱歉
如果您使用的是.each()，则不要使用变量来存储它。他想说你正在使用一个额外的变量，如果你不返回任何东西，它什么也不存储。
我必须在哪里写return false..？
@AbdulWaheed in if 条件

【解决方案4】：

在我的理解中，focus 是指 highlight 所有元素。如果是这样，你可以试试attribute 选择器。

$(function(){
  $('.searchskill[value=""]').addClass('error')
})

.error{
  border: 1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type ="text" class="searchskill" value=" "> 
<input type ="text" class="searchskill" value="3"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4">
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4">

【讨论】：

【解决方案5】：

选择器会更简单。

// highlight all empty fields and focus on the first one
$('.searchskill[value=""]').css({"border-style": "solid", "border-color": "red"})[0].focus();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="3"> 
<input type ="text" class="searchskill" value=""> 
<input type ="text" class="searchskill" value="4">

【讨论】：