質問編集履歴
1
情報の追加
title
CHANGED
File without changes
|
body
CHANGED
@@ -120,4 +120,52 @@
|
|
120
120
|
});
|
121
121
|
</script>
|
122
122
|
```
|
123
|
-
と書いたコードの実行。
|
123
|
+
と書いたコードの実行。
|
124
|
+
|
125
|
+
### 追記
|
126
|
+
jquery部分を
|
127
|
+
```ここに言語を入力
|
128
|
+
<script type="text/javascript">
|
129
|
+
$(document).ready(function(){
|
130
|
+
$('.btn_menu').click(function(){
|
131
|
+
var obj = $(this);
|
132
|
+
$('nav').toggleClass('open');
|
133
|
+
$('h4').each(function(){
|
134
|
+
if($.trim($(this).text().toLowerCase()) == $.trim(obj.text().toLowerCase())){
|
135
|
+
$('.jq').nextAll().show();
|
136
|
+
}
|
137
|
+
else
|
138
|
+
{
|
139
|
+
$(this).hide();
|
140
|
+
}
|
141
|
+
});
|
142
|
+
});
|
143
|
+
});
|
144
|
+
</script>
|
145
|
+
```
|
146
|
+
としhtmlを
|
147
|
+
```ここに言語を入力
|
148
|
+
<nav>
|
149
|
+
<h2>HOMEPAGE</h2>
|
150
|
+
<!---->
|
151
|
+
<div class="jq">
|
152
|
+
<h4>AAA</h4>
|
153
|
+
<p>dog</p>
|
154
|
+
</div>
|
155
|
+
<!---->
|
156
|
+
<div class="jq">
|
157
|
+
<h4>BBB</h4>
|
158
|
+
<p>cat</p>
|
159
|
+
</div>
|
160
|
+
<!---->
|
161
|
+
<div class="jq">
|
162
|
+
<h4>CCC</h4>
|
163
|
+
<p>rabbit</p>
|
164
|
+
</div>
|
165
|
+
<!---->
|
166
|
+
</nav>
|
167
|
+
```
|
168
|
+
と変更したら、今度は
|
169
|
+
AAAボタンを押すとそれ以降のpタグが取得され、
|
170
|
+
BBBボタンを押すとAAAやCCCのpタグも取得されるという意図していない挙動になった。
|
171
|
+
$('.jq').nextAll().show(); とnextAll()メソッドを使い、<div class="jq">で囲まれた部分を取得したかった。
|