jqueryで値を取得できません

Question

次のコードがあります。

<ul class="multi-list tabs"> 
<li class="width-50 selected"><a class="first" value="123456">Mark Complete</a></li> 
<li class="width-50"><a class="last even" value="123456">Delete</a></li> 
<input type="hidden" name="wo[sub_complete_ids][]" value=""> 
<input type="hidden" name="wo[sub_delete_ids][]" value=""> 
</ul> 

li.selected a.firstの値を取得しようとしていますが、その値は未定義です。

マイトライアルコードは

console.log($("ul.multi-list li.selected a.first").val()); 

それで何が悪い、それは値を表示していないようです。期待値は123456です。

さらに、このulは倍数にすることができます。

Answer 1

$().val()の代わりに$().attr()を使用します。これは、後の入力フィールドのためです。好ましくは、jQueryの$.data(selector,key,value)メソッドを使用して、html要素にデータを格納および取得します。次のスニペットは、最初のリンクから値を取得します。

$(document).ready(function() { 
 
     alert($('ul.multi-list li.selected a.first').attr('value')); 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul class="multi-list tabs"> 
 
    <li class="width-50 selected"><a class="first" value="123456">Mark Complete</a></li> 
 
    <li class="width-50"><a class="last even" value="123456">Delete</a></li> 
 
    <input type="hidden" name="wo[sub_complete_ids][]" value=""> 
 
    <input type="hidden" name="wo[sub_delete_ids][]" value=""> 
 
</ul>