回答編集履歴

2

コード追記

2020/12/09 03:13

投稿

hatena19
hatena19

スコア34073

test CHANGED
@@ -33,3 +33,133 @@
33
33
  });
34
34
 
35
35
  ```
36
+
37
+
38
+
39
+ 追記
40
+
41
+ ---
42
+
43
+ [戻るボタン]は一つのみで履歴を遡って最初の質問まで戻ることが可能にするコード例
44
+
45
+
46
+
47
+ 質問の移動履歴を配列に格納してそれを元に戻ります。
48
+
49
+
50
+
51
+ ```html
52
+
53
+ <!DOCTYPE html>
54
+
55
+ <html lang="ja">
56
+
57
+
58
+
59
+ <head>
60
+
61
+ <meta charset="UTF-8">
62
+
63
+ <title>タイトル</title>
64
+
65
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
66
+
67
+ <script>
68
+
69
+ $(function () {
70
+
71
+ let hash_history=["#q_01"];
72
+
73
+ $("#back").on("click", function () {
74
+
75
+ let id = hash_history.pop()
76
+
77
+ $(id).hide();
78
+
79
+ id = hash_history[hash_history.length - 1];
80
+
81
+ location.href = location.pathname + id;
82
+
83
+ $(id).addClass("active").show("fast");
84
+
85
+ if(hash_history.length===1) $("#back").hide();
86
+
87
+ });
88
+
89
+ $(".btn").on("click", function () {
90
+
91
+ $(this).closest("div").hide();
92
+
93
+ if(hash_history.length===1) $("#back").show("fast");
94
+
95
+ let id = $(this).attr("href");
96
+
97
+ hash_history.push(id);
98
+
99
+ $(id).addClass("active").show("fast");
100
+
101
+ });
102
+
103
+ });
104
+
105
+ </script>
106
+
107
+ </head>
108
+
109
+
110
+
111
+ <body>
112
+
113
+
114
+
115
+ <div class="qbox">
116
+
117
+ <div id="q_01" class="active">
118
+
119
+ <p>質問1</p>
120
+
121
+ <ul>
122
+
123
+ <li><a class="btn" href="#q_02">Yes</a></li>
124
+
125
+ <li><a class="btn" href="#q_03">No</a></li>
126
+
127
+ </ul>
128
+
129
+ </div>
130
+
131
+ <div id="q_02" style="display: none;">
132
+
133
+ <p>質問2</p>
134
+
135
+ <ul>
136
+
137
+ <li><a class="btn" href="#q_04">Yes</a></li>
138
+
139
+ </ul>
140
+
141
+ </div>
142
+
143
+ <div id="q_03" style="display: none;">
144
+
145
+ <p>質問3</p>
146
+
147
+ <ul>
148
+
149
+ <li><a class="btn" href="#q_04">Yes</a></li>
150
+
151
+ </ul>
152
+
153
+ </div>
154
+
155
+ <div id="q_04" style="display: none;">
156
+
157
+ <p>結果</p>
158
+
159
+ </div>
160
+
161
+ <input type="button" value="戻るボタン" id="back" style="display: none;">
162
+
163
+ </div>
164
+
165
+ ```

1

コード修正

2020/12/09 03:13

投稿

hatena19
hatena19

スコア34073

test CHANGED
@@ -9,8 +9,6 @@
9
9
  let back_hash;
10
10
 
11
11
  $(".back").on("click", function () {
12
-
13
- // back_hash = "q_"+$(this).data("back-qnum");
14
12
 
15
13
  location.href = location.pathname + "#" + back_hash;
16
14