Question

我有两行代码在多个循环上执行。

<label class="price">
    <em>Dynamic Value</em>
    <label class="price-actual" hidden>Actual Dynamic Value/label>
</label>

跟随jquery函数。

$('body').on('click', '.price',
    function (e) {
        var actualClicked = $(e.target);
        var clicked = actualClicked.children(".price-actual");
        alert(clicked.text());
    }
);

我的要求是，当我点击价格标签时，它会提醒其子类的实际动态值的值。

我做了上面的代码并且工作不正常。请让我骑一下。

Answer 1

将您的HTML代码替换为：

<div class="price">
    <em>Dynamic Value</em>
    <label class="price-actual" hidden>Actual Dynamic Value</label>
</div>

和Jquery一起：

$('body').on('click', '.price',
    function (e) {
        var actualClicked = $(this);
        var clicked = actualClicked.children(".price-actual");
        alert(clicked.text());
    }
);

Answer 2

您可以使用$(this)来触发事件触发的元素。

＆＃13;

$('body').on('click', '.price',
    function (e) {
        alert($(this).children(".price-actual").text());
    }
);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<label class="price">
    <em>Dynamic Value</em>
    <label class="price-actual" hidden>Actual Dynamic Value</label>
</label>

＆＃13;

Answer 3

试试这段代码

<label class="price">
<em>Dynamic Value</em>
<label class="price-actual" hidden>Actual Dynamic Value</label>
   </label>
<br>
 <label class="price">
<em>Dynamic Value</em>
<label class="price-actual" hidden>Actual Dynamic Value</label>
          </label>
                <br>
      <label class="price">
<em>Dynamic Value</em>
<label class="price-actual" hidden>Actual Dynamic Value</label>

和js

$(document).on('click', '.price',
function (e) {
console.log('a');
    var element= $(this);
    var vale = element.closest('.price').find('.price-actual').text();
    alert(vale);
}
     );

在HTML和JQuery上选择子元素

3 个答案: