同じクラスのすべてのリンクからテキストを取得する

Question

私はクリッククラスでアクティブなクラスを切り替えるフィルタを持っています。クリックすると、クラスをアクティブにしているリンクをループし、それらのリンクのテキストから新しい配列を作成したいと思います。しかし、私はループしているときに私はコンソールに何かを得ることはありません。 これはコードです

$('.filter-button').click(function() { 

    $(this).toggleClass('active'); 

    var activeTags = $('filter-button.active'); 

    $(activeTags).each(function() { 
    var tags[] = $(this.text()); 
    }); 

    console.log(tags); 
}); 

私は間違っていますか？

Answer 1

each()関数のローカル変数である新しいtagsを各要素に対して作成しています。関数が終了すると、それは破棄されます。

あなたの外側console.log()は、存在しないものの値を一覧表示しようとしています（each()の機能の中にいないため）。

each()の外に、アレイを作成し、に追加：

$('.filter-button').click(function() { 
 

 
    $(this).toggleClass('active'); 
 

 
    var activeTags = $('.filter-button.active'); 
 
    var tags = []; 
 

 
    $(activeTags).each(function() { 
 
    tags.push($(this).text()); 
 
    }); 
 

 
    console.log(tags); 
 
});

.active { 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class=filter-button>1</button> 
 
<button class=filter-button>2</button> 
 
<button class=filter-button>3</button> 
 
<button class=filter-button>4</button> 
 
<button class=filter-button>5</button>