javascript - 他の子が起動されたときに子要素を変更する

Question

<div class='wrap'>
    <textarea></textarea>
    <a href=''></a>
</div>

<div class='wrap'>
    <textarea></textarea>
    <a href=''></a>
</div>

<div class='wrap'>
    <textarea></textarea>
    <a href=''></a>
</div>

同じ子コンテンツを持つ親要素がたくさんありました。子に対してイベントが発生した場合、同じ親のもう一方の子で何かを行います。

例えば：

< textarea > onkeyup (from parent A) change the background-color of < a > (from parent A)

これに対処する方法は？

Answer 1

（イベントハンドラー内にsiblings適用される）、または場合によってはandの組み合わせ（他の要素が異なるレベルにある可能性がある場合、これはあなたの例では当てはまりません）のいずれかを探しています。$(this)closestfind

例 - siblings:ライブコピー| ソース

$(".wrap textarea").on("keyup", function() {
    var link = $(this).siblings("a");
    link.css("background-color", "green");
});

例 - closest+ find:ライブコピー| ソース

$(".wrap textarea").on("keyup", function() {
    var link = $(this).closest(".wrap").find("a");
    link.css("background-color", "green");
});