.data()キー/値に基づくフィルタ要素

filter jquery
.data()キー/値に基づくフィルタ要素

クラス `+ .navlink `の4つのdiv要素があり、クリックすると、 ` .data()`を使用して ` ‘selected’ `というキーを ` true +`の値に設定するとします。

$('.navlink')click(function() { $(this).data('selected', true); })

新しい `+ .navlink `がクリックされるたびに、後で操作するために以前に選択した ` navlink `を保存したいと思います。 ` .data()+`を使用して保存されたものに基づいて要素を選択するための迅速かつ簡単な方法はありますか?

請求書に適合するjQuery *:filters *はないようです。(同じclickイベント内で)次のことを試みましたが、何らかの理由で動作しません。

var $previous = $('.navlink').filter(
    function() { $(this).data("selected") == true }
);

私はこれを達成する他の方法があることを知っていますが、現在のところ、それが `+ .data()+`を介して実行できるかどうかに興味があります。

  110  25


ベストアンサー

フィルタは機能しますが、フィルタに渡された関数内の一致するオブジェクトを取得するには、trueを返す必要があります。

var $ previous = $( '。navlink')。filter(function(){return $(this).data( "selected")== true});

177


記録のためだけに、jqueryを使ってデータをフィルタすることができます(この質問はかなり古く、それ以来jQueryは進化してきたので、この解決策を書くことも当然です):

$('.navlink[data-selected="true"]');

または、より良い(パフォーマンスのために):

$('.navlink').filter('[data-selected="true"]');

または、 `+ data-selected +`が設定されたすべての要素を取得する場合:

$('[data-selected]')

*注*このメソッドはhtml-attributesで設定されたデータに対してのみ機能します。 `+ .data()+`呼び出しでデータを設定または変更すると、このメソッドは機能しなくなります。

128


プラグインはかなり簡単に作ることができます。

$ .fn.filterData = function(key、value){return this.filter(function(){return $(this).data(key)== value;}); ;

使い方(ラジオボタンをチェックする):

$( 'input [name = location_id]')。filterData( 'my-data'、 'data-val')。prop( 'checked'、true);

13


私が気づいた2つのこと(それらはあなたがそれを書き留めたときの間違いかもしれません)

  1. 最初の例でドットが抜けていた( + $( '。navlink')。click +

  2. フィルターが機能するには、値を返す必要があります(
    + return $(this).data(" selected ")== true +

8


その価値以上の仕事のように思えます。

1)現在選択されている要素\ jQueryオブジェクトへの参照を格納するJavaScript変数が1つだけではないのです。

2)現在選択されている要素にクラスを追加しませんか。 それからDOMに “.active”クラスか何かを問い合わせることができます。

-1


タイトルとURLをコピーしました