使用jquery獲取單擊類的子元素的值

Question

我有一個類amt ，當點擊該類時，我想獲得點擊的<h6> ， <span>和<label>標簽的值。 我如何在jquery中執行此操作？ 我已經在這里看到一個問題用jQuery獲取List Item的值，但它使用相同的

在標簽下但我必須在同一標簽下獲得不同的elemet值

 <li class="amt" id="diecut_am1"> <h6>50</h6> <span>$59.00</span> <label>$51.30</label> </li> <li class="amt" id="diecut_am2"> <h6>100</h6> <span>$68.00</span> <label>$61.20</label> </li> 

Answer 1

試試這個

$(".amt").click(function() {
    var elem1 = $(this).find("h6").html();
    var elem2 = $(this).find("span").html();
    var elem3 = $(this).find("label").html();

    alert(elem1);
    alert(elem2);
    alert(elem3);
});

https://jsfiddle.net/kLe5kLc3/1/

Answer 2

你可以這樣做：

$( document ).ready(function() {
    $('.amt').on("click", function() {
       var h6 = $(this).find('h6').text();
       var span = $(this).find('span').text();
       var label = $(this).find('label').text();
    });
});

演示： https ： //jsfiddle.net/12q12k52/

Answer 3

這是JS的方式：

 var amt = document.querySelectorAll('.amt') //add event listener to all .amt elements var amtArr = [].slice.call(amt) amtArr.forEach(function (x) { x.addEventListener('click', listChilds, true) }); //we retrive the target properties function listChilds(e) { console.log(e.path[1]) //all the children //if you want one in particular it would be console.log(e.target.childNodes[0]) } 

 <li class="amt" id="diecut_am1"> <h6>50</h6> <span>$59.00</span> <label>$51.30</label> </li> <li class="amt" id="diecut_am2"> <h6>100</h6> <span>$68.00</span> <label>$61.20</label> </li> 

Answer 4

您可以迭代單擊元素的子元素

$(this).children()