jquery - jQuery - ホバー時に要素から属性を取得

Question

.hover動的 ID に基づいて div を表示するクラスに適用しようとしています。例えば：

HTML

<div id="parent_one">
    <div class="touch" id="one">Touch me!</div>
    <div id="t_one"></div>
</div>
<div id="parent_two">
    <div class="touch" id="two">Touch me!</div>
    <div id="t_two"></div>
</div>

jQuery

$('.touch').hover(
    function(){
        var id = $(this).attr('id');
        var value = '#t_' + id;
        $(value).fadeIn(800);
    },
    function(){
        var id = $(this).attr('id');
        var value = '#t_' + id;
        $(value).delay(1500).fadeOut(800);
    }
);

私の間違いはの使用にあると感じていますが、$(this)それを突き止めることはできません。

Answer 1

これ：

var value = 't_' + id;

含める必要があります#:

var value = '#t_' + id;

t_oneそれ以外の場合は、既存のタグ名ではないtag を持つ要素を選択しているだけです。

ただし、これに ID を使用するのはかなり見苦しいです。このような一貫した HTML がある場合は、次のようなクラス構造を使用しないでください:

<div>
  <div class="touch-handle">Touch me!</div>
  <div class="content"></div>
</div>

このようなJSで：

$('.touch-handle').hover(
  function(){
    $(this).next('.content').fadeIn(800);
  },
  function(){
    $(this).next('.content').delay(1500).fadeOut(800);
  }
);