クリック時にクラスが切り替えられない

user4157770

リンクを含むナビゲーションコントロールがあります。

ユーザーがリンクをクリックしたときに、2つのリンクのクラス属性を切り替えたいと思います。

クリックされたリンクに「targeted」のクラスを割り当てたい。

また、前に選択したリンクから「targeted」クラスを削除したいと思います。

これが私の現在のes6jsです。

$(() => {
//when one is clicked, remove the class from each of them and then add the class to the one that was clicked
    $(document).on("click", ".tools-cover .tools-container > .row > .col-xs-12 > nav ul li a", (e) => {

        $(document).find(".tools-cover .tools-container > .row > .col-xs-12 > nav ul li a").removeClass("targeted");

        $(this).toggleClass("targeted");

    });

//when the page has loaded, click the first nav link on the nav
    $(document).find(".tools-cover .tools-container > .row > .col-xs-12 > nav ul li:first-child a").click();
});
<div class="tools-cover">
  <div class="container tools-container">
    <div class="row">
      <div class="col-xs-12">
        <nav>
          <ul>
            <li><a href="#">Feeds</a>
            </li>
            <li><a href="#">Wearisma links</a>
            </li>
          </ul>
        </nav>
      </div>
    </div>
  </div>
</div>

フェリックス・クリング

矢印関数には独自のthisがないため、jQueryはそれを現在の要素に設定できません。「通常の」関数をイベントハンドラーとして使用するe.target、のe.currentTarget代わりにまたは(これがイベント委任でどの程度うまく機能するわからない)を使用する必要がありthisます。

矢印関数と関数宣言/式も参照してください:それらは同等/交換可能ですか?

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

スクロール時にアクティブクラスが切り替えられない

分類Dev

クリックイベントに基づいてcssクラスが適切に切り替えられない

分類Dev

マスターグリッドビューチェックボックスが切り替えられたときに、ネストされたグリッドビューチェックボックスが切り替えられない

分類Dev

マスターグリッドビューチェックボックスが切り替えられたときに、ネストされたグリッドビューチェックボックスが切り替えられない

分類Dev

ラップトップの充電時に切り替え可能なグラフィックスがハイパワーGPUに切り替わらないようにするにはどうすればよいですか?

分類Dev

BootstrapToggleプラグイン-Angular使用時にチェックボックスが切り替わらない

分類Dev

VueJSでクリック時にクラスを切り替えます

分類Dev

チェックボックスでチェックされた属性が切り替えられない

分類Dev

JqueryからJavascriptへ:クリック時にクラスを切り替えます

分類Dev

現在クリックされているクラスの子のみにクラスを切り替える方法

分類Dev

イオンスライドボックススライド切り替え時に音を鳴らす方法は?クリックなし

分類Dev

要素がクリックされたら、別のクラスでこの要素に最も近い要素を見つけて切り替えます

分類Dev

Reactで子がクリックされた場合を除いてクラスを切り替えます

分類Dev

別の要素がクリックされたときに要素のクラスを切り替えますReact

分類Dev

スクロールトップが制限を超えた場合、クラスが正しく切り替えられない

分類Dev

ボタンクリック時にボタンの値とクラスを切り替えるにはどうすればよいですか

分類Dev

クラスを切り替えられないのはなぜですか?

分類Dev

切り替え時にKDEデスクトップが失われる

分類Dev

ラジオボタンをクリックしてもD3JSグラフが切り替えられない

分類Dev

クリックイベント時にjQueryを使用してクラスを切り替える

分類Dev

Javascript-クリック時に複数のクラスを切り替えます

分類Dev

NVidiaから内部IntelHDグラフィックスへの切り替え-OpenGLが機能しない

分類Dev

帯域幅が変更されたときにExoplayerがHLSトラックを切り替えない理由

分類Dev

クラスがjQueryで切り替えられたときにCSSスタイルがすぐに適用されない

分類Dev

クラスを切り替えるときに遷移が機能しない

分類Dev

jQueryはクリック時に無関係なdivを切り替えます

分類Dev

クリック時に展開可能な背景を切り替えます

分類Dev

マウスを再度動かすことなく、要素(クリック時に変換される)のホバークラスを削除/切り替えるにはどうすればよいですか?

分類Dev

Firefoxが作成されたときにまだ新しいタブに切り替わるのはなぜですか?「新しいタブでリンクを開いたら、すぐに切り替える」にチェックを入れなかった

Related 関連記事

  1. 1

    スクロール時にアクティブクラスが切り替えられない

  2. 2

    クリックイベントに基づいてcssクラスが適切に切り替えられない

  3. 3

    マスターグリッドビューチェックボックスが切り替えられたときに、ネストされたグリッドビューチェックボックスが切り替えられない

  4. 4

    マスターグリッドビューチェックボックスが切り替えられたときに、ネストされたグリッドビューチェックボックスが切り替えられない

  5. 5

    ラップトップの充電時に切り替え可能なグラフィックスがハイパワーGPUに切り替わらないようにするにはどうすればよいですか?

  6. 6

    BootstrapToggleプラグイン-Angular使用時にチェックボックスが切り替わらない

  7. 7

    VueJSでクリック時にクラスを切り替えます

  8. 8

    チェックボックスでチェックされた属性が切り替えられない

  9. 9

    JqueryからJavascriptへ:クリック時にクラスを切り替えます

  10. 10

    現在クリックされているクラスの子のみにクラスを切り替える方法

  11. 11

    イオンスライドボックススライド切り替え時に音を鳴らす方法は?クリックなし

  12. 12

    要素がクリックされたら、別のクラスでこの要素に最も近い要素を見つけて切り替えます

  13. 13

    Reactで子がクリックされた場合を除いてクラスを切り替えます

  14. 14

    別の要素がクリックされたときに要素のクラスを切り替えますReact

  15. 15

    スクロールトップが制限を超えた場合、クラスが正しく切り替えられない

  16. 16

    ボタンクリック時にボタンの値とクラスを切り替えるにはどうすればよいですか

  17. 17

    クラスを切り替えられないのはなぜですか?

  18. 18

    切り替え時にKDEデスクトップが失われる

  19. 19

    ラジオボタンをクリックしてもD3JSグラフが切り替えられない

  20. 20

    クリックイベント時にjQueryを使用してクラスを切り替える

  21. 21

    Javascript-クリック時に複数のクラスを切り替えます

  22. 22

    NVidiaから内部IntelHDグラフィックスへの切り替え-OpenGLが機能しない

  23. 23

    帯域幅が変更されたときにExoplayerがHLSトラックを切り替えない理由

  24. 24

    クラスがjQueryで切り替えられたときにCSSスタイルがすぐに適用されない

  25. 25

    クラスを切り替えるときに遷移が機能しない

  26. 26

    jQueryはクリック時に無関係なdivを切り替えます

  27. 27

    クリック時に展開可能な背景を切り替えます

  28. 28

    マウスを再度動かすことなく、要素(クリック時に変換される)のホバークラスを削除/切り替えるにはどうすればよいですか?

  29. 29

    Firefoxが作成されたときにまだ新しいタブに切り替わるのはなぜですか?「新しいタブでリンクを開いたら、すぐに切り替える」にチェックを入れなかった

ホットタグ

アーカイブ