jQuery：如何获得输入文本的第一个值和最后一个值

Question

我不知道如何获取输入文本的最后一个值。当输入类型为空时，我已经获得第一个值，但没有获得值。这里是我的代码：

HTML

<input type="text" name="date[]" class="date" id="date" value="6/17"><br/> 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
<input type="text" name="date[]" class="date" id="date" value=""><br/> 
<input type="text" name="date[]" class="date" id="date" value=""><br/> 

JS/jQuery的

$(document).ready(function(){ 
    var $set = $('.date'); 
    var len = $set.length; 
    $set.each(function(index, element) { 
     if (index === 0) { 
      alert (this.value); 
     } 
    });  
}); 

Answer 1

你可以扭转你的循环，并从去年开始。

var $set = $('.date'); 
var len = $set.length; 
var firstVal = $($set[0]).val(); 
var lastVal = null; 
for (var i = len - 1; i > 0; i--){ 
    if ($($set[i]).val()){ 
    lastVal = $($set[i]).val(); 
    break; 
    } 
} 

Answer 2

您可以使用[！值= '']只选择值输入。 然后使用first（）和last（）从所选列表的第一个项目和最后一个项目中获取值。

var $values = $(".date[value!='']"); 
 
$("#firstValue").html($values.first().val()); 
 
$("#lastValue").html($values.last().val());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="date[]" class="date" id="date" value="6/17"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value=""><br/> 
 
<input type="text" name="date[]" class="date" id="date" value=""><br/> 
 
<div>First value: <span id="firstValue"></span></div> 
 
<div>Last value: <span id="lastValue"></span></div>

Answer 3

我不知道如何获得输入文本最后一个值。当输入类型为空时，我已获得 的第一个值，但没有获得值。

这应该工作。

var result = $("input[value!='']"); 
 
console.log(result.first().val()); 
 
console.log(result.last().val());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="date[]" class="date" id="date" value="6/17"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/18"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value="6/19"><br/> 
 
<input type="text" name="date[]" class="date" id="date" value=""><br/> 
 
<input type="text" name="date[]" class="date" id="date" value=""><br/>

而且，就像一个侧面提示，不要使用具有相同的值，因为这是无效的HTML多id属性。相反，如果您想访问多个元素，请使用您已完成的类属性。