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

您可以使用[value！='']仅选择带值的输入。然后使用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 2

您可以反转循环并从最后开始。

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 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/>

此外，作为旁注，请不要使用具有相同值的多个id属性，因为这是无效的HTML。相反，如果要访问多个元素，请使用您已经完成的class属性。

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

3 个答案: