teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

4

検証済のコードに修正

2018/10/27 02:54

投稿

think49
think49

スコア18194

answer CHANGED
@@ -1,10 +1,39 @@
1
1
  ### .attr( attributeName, function )
2
2
 
3
- 以下、未検証。
3
+ ~~以下、未検証。~~
4
- http://api.jquery.com/attr/#attr-attributeName-function
5
4
 
5
+ **(2018/10/27 11:54追記)**
6
+ 検証済のコードに修正しました。
7
+
8
+ - [jQuery#atttr( attributeName, function ) - JSFiddle](http://jsfiddle.net/Lm9xkhrs/)
9
+ - [.attr() | jQuery API Documentation](http://api.jquery.com/attr/#attr-attributeName-function)
10
+
11
+ ```HTML
12
+ <div class="sp-slide">
13
+ <a href="./img/01.jpg" title="オーバーレイ時のキャプション">
14
+ <img class="sp-image" src="https://placehold.jp/3d4070/ffffff/150x150.png?text=%E5%86%99%E7%9C%9F1" data-src="./img/01.jpg" data-retina="./img/01.jpg">
15
+ </a>
16
+ <p class="sp-layer sp-black sp-padding">写真1の説明文が入ります</p><!--メイン画像表示中のキャプション-->
17
+ </div>
18
+
19
+ <div class="sp-slide">
20
+ <a href="./img/02.jpg" title="オーバーレイ時のキャプション">
21
+ <img class="sp-image" src="https://placehold.jp/3d4070/ffffff/150x150.png?text=%E5%86%99%E7%9C%9F2" data-src="./img/02.jpg" data-retina="./img/02.jpg">
22
+ </a>
23
+ <p class="sp-layer sp-black sp-padding">写真2の説明文が入ります</p><!--メイン画像表示中のキャプション-->
24
+ </div>
25
+
26
+ <div class="sp-slide">
27
+ <a href="./img/03.jpg" title="オーバーレイ時のキャプション">
28
+ <img class="sp-image" src="https://placehold.jp/3d4070/ffffff/150x150.png?text=%E5%86%99%E7%9C%9F3" data-src="./img/03.jpg" data-retina="./img/03.jpg">
29
+ </a>
30
+ <p class="sp-layer sp-black sp-padding">写真3の説明文が入ります</p><!--メイン画像表示中のキャプション-->
31
+ </div>
32
+
6
- ```JavaScript
33
+ <script>
34
+ 'use strict';
7
- jQuery('.sp-slide>a').attr('title', function () { return jQuery('.sp-layer', this).text(); });
35
+ jQuery('.sp-slide>a').attr('title', function () { return this.nextElementSibling.textContent; });
36
+ </script>
8
37
  ```
9
38
 
10
39
  Re: akinco さん

3

jQuery('.sp-slide>a')

2018/10/27 02:54

投稿

think49
think49

スコア18194

answer CHANGED
@@ -4,7 +4,7 @@
4
4
  http://api.jquery.com/attr/#attr-attributeName-function
5
5
 
6
6
  ```JavaScript
7
- jQuery('.sp-slide>a>.sp-layer').attr('title', function () { return this.textContent; });
7
+ jQuery('.sp-slide>a').attr('title', function () { return jQuery('.sp-layer', this).text(); });
8
8
  ```
9
9
 
10
10
  Re: akinco さん

2

アロー関数 -> 関数式

2018/10/26 12:54

投稿

think49
think49

スコア18194

answer CHANGED
@@ -4,7 +4,7 @@
4
4
  http://api.jquery.com/attr/#attr-attributeName-function
5
5
 
6
6
  ```JavaScript
7
- jQuery( '.sp-slide>a>.sp-layer').attr('title', () => this.textContent);
7
+ jQuery('.sp-slide>a>.sp-layer').attr('title', function () { return this.textContent; });
8
8
  ```
9
9
 
10
10
  Re: akinco さん

1

typo修正

2018/10/26 03:55

投稿

think49
think49

スコア18194

answer CHANGED
@@ -4,7 +4,7 @@
4
4
  http://api.jquery.com/attr/#attr-attributeName-function
5
5
 
6
6
  ```JavaScript
7
- jQuery( '.sp-slide>a>.sp-layer'').attr('title', () => this.textContent);
7
+ jQuery( '.sp-slide>a>.sp-layer').attr('title', () => this.textContent);
8
8
  ```
9
9
 
10
10
  Re: akinco さん