回答編集履歴
2
ミスがあったため修正。
test
CHANGED
@@ -86,6 +86,6 @@
|
|
86
86
|
|
87
87
|
// ↓
|
88
88
|
|
89
|
-
$( $( this ).data( '
|
89
|
+
$( $( this ).data( 'href' ) ).show(); // $( this ).data( 'data-href' ) から修正
|
90
90
|
|
91
|
-
```
|
91
|
+
```**動くサンプル:**[https://jsfiddle.net/u0g0p7k5/](https://jsfiddle.net/u0g0p7k5/)
|
1
補足の追加。
test
CHANGED
@@ -43,3 +43,49 @@
|
|
43
43
|
} );
|
44
44
|
|
45
45
|
```**動くサンプル:**[https://jsfiddle.net/f2dtneh6/1/](https://jsfiddle.net/f2dtneh6/1/)
|
46
|
+
|
47
|
+
|
48
|
+
|
49
|
+
---
|
50
|
+
|
51
|
+
|
52
|
+
|
53
|
+
**追記:**
|
54
|
+
|
55
|
+
|
56
|
+
|
57
|
+
a要素でクリックせずに、span要素などに書き換えてしまえば他の関数のことを考える手間も無いでしょう。
|
58
|
+
|
59
|
+
|
60
|
+
|
61
|
+
```HTML
|
62
|
+
|
63
|
+
<!--
|
64
|
+
|
65
|
+
<li><a href="#tab01" class="current">color</a></li>
|
66
|
+
|
67
|
+
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ -->
|
68
|
+
|
69
|
+
<li><span data-href="#tab01" class="current">color</span></li>
|
70
|
+
|
71
|
+
```
|
72
|
+
|
73
|
+
```JavaScript
|
74
|
+
|
75
|
+
// $( 'a' ).click( function(){
|
76
|
+
|
77
|
+
// ↓
|
78
|
+
|
79
|
+
$( 'span[data-href]' ).on( 'click', function() {
|
80
|
+
|
81
|
+
```
|
82
|
+
|
83
|
+
```JavaScript
|
84
|
+
|
85
|
+
// $( $( this ).attr( 'href') ).show();
|
86
|
+
|
87
|
+
// ↓
|
88
|
+
|
89
|
+
$( $( this ).data( 'data-href') ).show();
|
90
|
+
|
91
|
+
```
|