回答編集履歴
1
コメントに詳細な解説を追加。ベストアンサーほしい一審で笑
test
CHANGED
|
@@ -16,27 +16,73 @@
|
|
|
16
16
|
|
|
17
17
|
<script>
|
|
18
18
|
|
|
19
|
-
$(function(){
|
|
19
|
+
$(function(){
|
|
20
20
|
|
|
21
|
-
$('.areaInfo').click(function(){
|
|
22
21
|
|
|
23
|
-
var json = {category:'中央区',id:1,address:'cuouku'};//これはたぶんajaxでとりますよね？
|
|
24
22
|
|
|
25
|
-
|
|
23
|
+
//.areaInfoがクリックされたら
|
|
26
24
|
|
|
27
|
-
$('
|
|
25
|
+
$('.areaInfo').click(function(){
|
|
28
26
|
|
|
29
|
-
$('#' + area + ' h4.category').text(json["category"]);
|
|
30
27
|
|
|
31
|
-
$('#' + area + ' a.i_map').attr("href","https://www.google.co.jp/maps/search/" + json["address"]);
|
|
32
28
|
|
|
33
|
-
|
|
29
|
+
//これはたぶんajaxでとりますか？
|
|
34
30
|
|
|
31
|
+
var json = {category:'中央区',id:1,address:'cuouku'};
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
//クリックされたdata-areaの値を変数areaに代入
|
|
36
|
+
|
|
37
|
+
//この後出てくるareaは'chuoku'という文字列になる
|
|
38
|
+
|
|
39
|
+
var area = $(this).attr('data-area');
|
|
40
|
+
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
//この場合だと#chuoukuの子要素のa.detail_linkのhrefに「detail.php?id=1」が入る
|
|
44
|
+
|
|
45
|
+
$('#' + area + ' a.detail_link').attr("href","detail.php?id=" + json["id"]);
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
//この場合だと#chuoukuの子要素のh4.categoryに「中央区」が入る
|
|
50
|
+
|
|
51
|
+
$('#' + area + ' h4.category').text(json["category"]);
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
//この場合だと#chuoukuの子要素のh4.categoryのhref属性の値に
|
|
56
|
+
|
|
57
|
+
//「https://www.google.co.jp/maps/search/cuouku」が入る
|
|
58
|
+
|
|
59
|
+
var gmapUrl = "https://www.google.co.jp/maps/search/" + json["address"];
|
|
60
|
+
|
|
61
|
+
$('#' + area + ' a.i_map').attr("href",gmapUrl);
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
//aタグのなかに「cuouku」が入る
|
|
66
|
+
|
|
67
|
+
$('#' + area + ' a.i_map').text(json["address"]);
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
//非表示のtrを表示させる。ただtrをtableだったか。。
|
|
72
|
+
|
|
73
|
+
//→とりあえず表示しますが、レイアウト上の問題があるかも
|
|
74
|
+
|
|
35
|
-
|
|
75
|
+
$('#' + area).css("display","table");
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
|
|
79
|
+
});//.areaInfoクリックで発生する処理終了
|
|
80
|
+
|
|
81
|
+
|
|
36
82
|
|
|
37
83
|
});
|
|
38
84
|
|
|
39
|
-
|
|
85
|
+
|
|
40
86
|
|
|
41
87
|
</script>
|
|
42
88
|
|