單擊按鈕從UL獲取id

Question

單擊“添加”按鈕時如何從ul獲取OptionGroupID和optionName ？

例如：

<ul id="formAddOption_4" class="formStyle">
   <li> 
     <input id="OptionGroupID" type="hidden" value="4"> 
     <div style="font-size:10px;"> Option Name: </div> 
     <input id="optionName" type="text">
  </li>
  <li>
   <input type="button" class="buttonAddOption" value="Add Option"> 
  </li>
</ul>
<ul id="formAddOption_5" class="formStyle">
   <li> 
     <input id="OptionGroupID" type="hidden" value="5"> 
     <div style="font-size:10px;"> Option Name: </div> 
     <input id="optionName" type="text">
  </li>
  <li>
   <input type="button" class="buttonAddOption" value="Add Option"> 
  </li>
</ul>

我試過這個，但它不起作用：

$(".buttonAddOption").click(function() {
  var OptionForm = $(this).closest("ul");
  //Get Group ID
  alert( OptionForm.$("#OptionGroupID").val() );
});

Answer 1

$(".buttonAddOption").click(function() {
    var OptionForm = $(this).closest("ul");
    alert( OptionForm.find("#OptionGroupID").val() );
});

請注意，我使用了OptionForm.find （查找后代）。 僅供參考：ID是唯一的，因此您可能應該為每個輸入添加一個類，並且如下所示： OptionForm.find(".OptionGroupID") 。