0

Jquery セレクター:

//left side
$('section.abstract label.gcsubheader')
//right side
$('fieldset.abstract label.formElems')

両方の戻り値: (クラスは異なりますが、for="*"残りは同じです)

<label for=​"design" class=​"displayHidden formElems">​Design​&lt;/label>​ 
<label for=​"expertise" class=​"displayHidden formElems">​Expertise​&lt;/label>​
<label for=​"skills" class=​"displayHidden formElems">​Skills​&lt;/label>​
<label for=​"tools" class=​"displayHidden formElems">​Tools​&lt;/label>​
<label for=​"projects" class=​"displayHidden formElems">​Projects​&lt;/label>​
<label for=​"community" class=​"displayHidden formElems">​Community​&lt;/label>​
<label for=​"interests" class=​"displayHidden formElems">​Interests​&lt;/label>​

左のセレクターに次のようなものを追加したいと思います。

.find($('label[for="' + $(this).text().toLowerCase() + '"]'))

また

var $this = $(this).text().toLowerCase();   //and use the $this in the concatenation:

labels for="design"selector のような要素の選択を実現し($('label[for="design"]'))ますが、動的に実行します。アイデアは、私が初めてリファクタリングを試みており、非常に多くの要素を持っているということです。1 つの要素をクリックすると、自分自身を見つけ、そのlabel for文字列を共有する別の要素を見つけたいと考えています。

私が試してみました：

$('section.abstract label.gcsubheader').click(function () {
     var $this = $(this).text().toLowerCase();
     //left element - hide
     $('section.abstract label.gcsubheader')..find($('label[for="' + $this + '"]')).show();
     //Right Side - show
     $('fieldset.abstract label.formElems').find($('label[for="' + $this + '"]')).show();
}

と

$('fieldset.abstract label.formElems').find($('label[for="' + $(this).text().toLowerCase() + '"]')).show();

私が間違っているのかわかりません。抽象化の別のレイヤーが要素のテキストを取得/定義できるようにする必要がありますか、それとも構文が間違っているか、何か他の問題がありますか? 私はこれを取得したいと思っているので、左右の .hidden クラスを切り替えて、コードの非常に堅牢なリファクタリングを提供できます。おそらく次のようなものですか?:

$('label[for="*"]').click(function () {
   // for each .toggleClass('hidden'); 
}

*orの書き方もよくわかりませんfor eachが、そこにたどり着きます。大変お世話になりました。

4

1 に答える 1

1

.最初の呼び出しの前に余分なものがありfind()、閉じられていない文字列リテラルが引数として渡されます。click内部関数とメソッドの両方の閉じ括弧に注意してください。.show()おそらく必要なときに、左要素にも使用していました.hide()。

さらに、属性 equals セレクターを次のように元のセレクター ステートメントに追加してもまったく問題ありません (完全な html がなかったので、セレクターを少し調整する必要があるかもしれません)。

$('section.abstract label.gcsubheader').click(function () {
    var $this = $(this).text().toLowerCase();

    //left element - hide
    $('section.abstract label.gcsubheader[for="' + $this + '"]').hide();

    //Right Side - show
    $('fieldset.abstract label.formElems[for="' + $this + '"]').show();
});

任意のラベルへのバインドについては、代わりにhas-attribute セレクターfor='*'を使用することを検討してください。

$('label[for]').click( /* ... */ );
于 2012-07-15T23:47:29.203 に答える