質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

145閲覧

同名クラスの別ブロックでindexを個別に取得したい

Hi_32

総合スコア23

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2020/05/30 02:40

indexを使って、順番を取得したいのですが、別ブロックでもクラス名が同じだと、連番で番号を取得してしまいます。
1ブロックずつ0から再スタートさせたいのですが、やり方がわかりません。
よろしくお願いいたします。

該当のソースコード

html

1 <ul class="clickList"> 2 <li>0</li> 3 <li>1</li> 4 </ul> 5 <ul class="clickList"> 6 <li>0にしたい</li> 7 <li>1にしたい</li> 8 </ul> 9 <p>上をクリックすると反応します</p> 10 <ul class="activeList"> 11 <li>0</li> 12 <li>1</li> 13 <li>2</li> 14 <li>3</li> 15 </ul> 16 <script> 17 $(function(){ 18 $(".clickList>li").click(function() { 19 $(".activeList>li").css("display","none"); 20 let active=$(".clickList>li").index(this); 21 $(".activeList>li").eq(active).css("display","block"); 22 }); 23 }); 24 </script> 25

補足情報(FW/ツールのバージョンなど)

jqueryは3系です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

ベストアンサー

javascript

1$(function(){ 2 $('.clickList>li').on('click',function() { 3 let active=$(this).parent().find('>li').index(this); 4 $('.activeList>li').hide().eq(active).show(); 5 }); 6});

投稿2020/05/30 02:55

yambejp

総合スコア115008

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Hi_32

2020/05/30 03:06

なるほど、親だけの子供の順番をとるんですね。 勉強になりました。 ありがとうございました。
guest

0

js

1$(this).parent().find("li").index(this);

投稿2020/05/30 02:47

kei344

総合スコア69458

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Hi_32

2020/05/30 03:07

なるほど、親だけの子供の順番をとるんですね。 勉強になりました。 ありがとうございました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問