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

Iは、入力されたテキストの最後の値を取得する方法は考えています。私は既に の最初の値を取得します。入力タイプが空の場合は値が得られません。

これは機能するはずです。

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の属性を使用しないでください。むしろ、複数の要素にアクセスしたい場合は、すでに行ったクラス属性を使用します。