javascript - jqueryの複数のIDセレクターの変更

Question

簡単な質問があります。ID に従って div を表示および非表示にしたいのですが、わかりませんでした。たとえば、異なる div と異なる ID を持つ入力があります。

<input onfocus="showtip(1)" onblur="hidetip(1); />
<div id="tip1"></div>
<input onfocus="showtip(2)" onblur="hidetip(2); />
<div id="tip2"></div>

と

function showtip(id) {
    $('.tip[id]').show('slow');
}
function hidetip(id) {
    $('.tip[id]').hide('slow');
}

私はそれを機能させるためにjavascriptで書くことができますが、アニメーションでそれを隠すことはできません。したがって、jqueryを使用しましたが、IDを定義できません:(助けてくれてありがとう！

score 2 · Accepted Answer

idjQuery で属性を使用するには、 id セレクターを使用します。

$('#<yourid>').show('slow');

あなたの方法は次のようになります：

function showtip(id) {
   $('#tip'+id).show('slow');
}

(注:idsドキュメント全体で一意である必要があるためdiv、セレクターにビットを含める必要はありません)

id他のものを意味するような文字を含む属性(.つまり、クラスセレクター) を指定する場合は、属性 equals セレクターを使用できます。

$('[id="123.abc"]').show('slow')

score 1 · Accepted Answer

@ManseUKの方法は断然最も一般的です。ただし、技術的には正しくありません。たとえば、CSSで他の意味を持つ文字を含むidの場合は失敗し.ます。最も正しい解決策は次のとおりです。

function showTip(id) {
    $(document.getElementById(id)).show("slow");
}

// This will work:
<div id="abc.123"></div>
showTip("abc.123");

$("#" + id)このソリューションは、内部的にはjQueryが変換するものであるため（機能する場合）、非常にわずかに高速です。

これがどのように機能するか：

score 1 · Accepted Answer

もしかして：

function showtip(id) {
    $('#'+tip).show('slow');
    //OR
    $('yourElement[id="'+tip+'"]').show('slow');
}

3 に答える 3