回答編集履歴
8
適当にソースを書いてたので恥ずかしくなり訂正\(汗\)
test
CHANGED
@@ -22,209 +22,283 @@
|
|
22
22
|
|
23
23
|
<!DOCTYPE html>
|
24
24
|
|
25
|
-
<html>
|
26
|
-
|
27
|
-
<head>
|
28
|
-
|
29
|
-
<title>置換
|
30
|
-
|
31
|
-
<meta charset="utf-8">
|
32
|
-
|
33
|
-
</head>
|
34
|
-
|
35
|
-
<body>
|
36
|
-
|
37
|
-
<h1>置換
|
38
|
-
|
39
|
-
<p>
|
40
|
-
|
41
|
-
置換前<br>
|
42
|
-
|
43
|
-
<textarea id="before" rows="
|
44
|
-
|
45
|
-
</p>
|
46
|
-
|
47
|
-
<p>
|
48
|
-
|
49
|
-
置換したい文字列<br>
|
50
|
-
|
51
|
-
<input type="text" id="target" value="">
|
52
|
-
|
53
|
-
</p>
|
54
|
-
|
55
|
-
<p>
|
56
|
-
|
57
|
-
追加したい文字列<br>
|
58
|
-
|
59
|
-
<input type="text" id="add" value="">
|
60
|
-
|
61
|
-
</p>
|
62
|
-
|
63
|
-
<p>
|
64
|
-
|
65
|
-
文字
|
66
|
-
|
67
|
-
<input type="number" id="number" value="">
|
68
|
-
|
69
|
-
</p>
|
70
|
-
|
71
|
-
<p>
|
72
|
-
|
73
|
-
<input type="submit" id="submit" value="置換スタート">
|
74
|
-
|
75
|
-
</p>
|
76
|
-
|
77
|
-
<p>
|
78
|
-
|
79
|
-
置換後<br>
|
80
|
-
|
81
|
-
<textarea id="after" rows="
|
82
|
-
|
83
|
-
</p>
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
|
88
|
-
|
89
|
-
<script>
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
jQuery(function(){ replace
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
(function(
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
replace.elements = function()
|
25
|
+
<html lang="ja">
|
26
|
+
|
27
|
+
<head>
|
28
|
+
|
29
|
+
<title>テキストの置換</title>
|
30
|
+
|
31
|
+
<meta charset="utf-8">
|
32
|
+
|
33
|
+
</head>
|
34
|
+
|
35
|
+
<body>
|
36
|
+
|
37
|
+
<h1>テキストの置換</h1>
|
38
|
+
|
39
|
+
<p>
|
40
|
+
|
41
|
+
置換前<br>
|
42
|
+
|
43
|
+
<textarea id="before" rows="8" cols="40"></textarea>
|
44
|
+
|
45
|
+
</p>
|
46
|
+
|
47
|
+
<p>
|
48
|
+
|
49
|
+
置換したい文字列<br>
|
50
|
+
|
51
|
+
<input type="text" id="target" value="">
|
52
|
+
|
53
|
+
</p>
|
54
|
+
|
55
|
+
<p>
|
56
|
+
|
57
|
+
追加したい文字列<br>
|
58
|
+
|
59
|
+
<input type="text" id="add" value="">
|
60
|
+
|
61
|
+
</p>
|
62
|
+
|
63
|
+
<p>
|
64
|
+
|
65
|
+
何文字置きに置換する?(数字)<br>
|
66
|
+
|
67
|
+
<input type="number" id="number" value="">
|
68
|
+
|
69
|
+
</p>
|
70
|
+
|
71
|
+
<p>
|
72
|
+
|
73
|
+
<input type="submit" id="submit" value="置換スタート">
|
74
|
+
|
75
|
+
</p>
|
76
|
+
|
77
|
+
<p>
|
78
|
+
|
79
|
+
置換後<br>
|
80
|
+
|
81
|
+
<textarea id="after" rows="8" cols="40"></textarea>
|
82
|
+
|
83
|
+
</p>
|
84
|
+
|
85
|
+
|
86
|
+
|
87
|
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
|
88
|
+
|
89
|
+
<script>
|
90
|
+
|
91
|
+
|
92
|
+
|
93
|
+
var gv;
|
94
|
+
|
95
|
+
jQuery(function(){ gv.replaceText(); });
|
96
|
+
|
97
|
+
|
98
|
+
|
99
|
+
(function(gv,$)
|
104
100
|
|
105
101
|
{
|
106
102
|
|
107
|
-
var el = {};
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
va
|
103
|
+
gv.replaceText = function()
|
112
104
|
|
113
105
|
{
|
114
106
|
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
el
|
120
|
-
|
121
|
-
el
|
122
|
-
|
123
|
-
el
|
124
|
-
|
125
|
-
el
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
107
|
+
var r = new Replace(
|
108
|
+
|
109
|
+
{
|
110
|
+
|
111
|
+
before:{element:"#before",errorMsg:"「置換前」が空だよ\n"},
|
112
|
+
|
113
|
+
target:{element:"#target",errorMsg:"「置換したい文字列」が空だよ\n"},
|
114
|
+
|
115
|
+
add:{element:"#add",errorMsg:"「追加したい文字列」が空だよ\n"},
|
116
|
+
|
117
|
+
number:{element:"#number",errorMsg:["「何文字置きに置換する?(数字)」が空だよ","「何文字置きに置換する?(数字)」の数字がおかしいよ。整数で正の数のみだよ。"]},
|
118
|
+
|
119
|
+
after:"#after"
|
120
|
+
|
121
|
+
});
|
122
|
+
|
123
|
+
|
124
|
+
|
125
|
+
$("#submit").on("click",function(){r.clickSubmit()});
|
126
|
+
|
127
|
+
|
128
|
+
|
129
|
+
|
130
|
+
|
131
|
+
function Replace(el)
|
132
|
+
|
133
|
+
{
|
134
|
+
|
135
|
+
this.el = {};
|
136
|
+
|
137
|
+
this.el.before = new Elm(el.before);
|
138
|
+
|
139
|
+
this.el.target = new Elm(el.target);
|
140
|
+
|
141
|
+
this.el.add = new Elm(el.add);
|
142
|
+
|
143
|
+
this.el.number = new Elm(el.number);
|
144
|
+
|
145
|
+
this.el.errorCheckEl = ['before','target','add','number'];
|
146
|
+
|
147
|
+
this.el.errorCheckElLength = 4;
|
148
|
+
|
149
|
+
this.el.after = $(el.after);
|
150
|
+
|
151
|
+
}
|
152
|
+
|
153
|
+
|
154
|
+
|
155
|
+
Replace.prototype.clickSubmit = function()
|
156
|
+
|
157
|
+
{
|
158
|
+
|
159
|
+
var value = [],replaceValue = { value:"",replaceCount:0 };
|
160
|
+
|
161
|
+
if(this.valueCheck()) return;
|
162
|
+
|
163
|
+
value = this.el.before.getVal().split(this.el.target.getVal());
|
164
|
+
|
165
|
+
if(value.length <= 1) { alert("「置換したい文字列」で指定した「" + this.el.target.getVal() + "」は「置換前」にないよ"); return; }
|
166
|
+
|
167
|
+
replaceValue = this.replace({ resultAry:value });
|
168
|
+
|
169
|
+
this.showReplaceValue(replaceValue);
|
170
|
+
|
171
|
+
};
|
172
|
+
|
173
|
+
|
174
|
+
|
175
|
+
Replace.prototype.valueCheck = function()
|
176
|
+
|
177
|
+
{
|
178
|
+
|
179
|
+
var error = [];
|
180
|
+
|
181
|
+
for (var i = 0; i < this.el.errorCheckElLength; i++)
|
182
|
+
|
183
|
+
{
|
184
|
+
|
185
|
+
this.el[this.el.errorCheckEl[i]].setVal();
|
186
|
+
|
187
|
+
if(this.el[this.el.errorCheckEl[i]].isError()) error.push(this.el[this.el.errorCheckEl[i]].getErrorMsg());
|
188
|
+
|
189
|
+
}
|
190
|
+
|
191
|
+
if(error.length > 0){ alert(error.join("")); return true; }
|
192
|
+
|
193
|
+
else return false;
|
194
|
+
|
195
|
+
};
|
196
|
+
|
197
|
+
|
198
|
+
|
199
|
+
Replace.prototype.replace = function(v)
|
200
|
+
|
201
|
+
{
|
202
|
+
|
203
|
+
var temp = {value:"",replaceCount:0},
|
204
|
+
|
205
|
+
length = v.resultAry.length;
|
206
|
+
|
207
|
+
for (var i = 0; i < length; i++)
|
208
|
+
|
209
|
+
{
|
210
|
+
|
211
|
+
temp.value += v.resultAry[i];
|
212
|
+
|
213
|
+
if(i === length - 1) break;
|
214
|
+
|
215
|
+
temp.value += this.el.target.getVal();
|
216
|
+
|
217
|
+
if((i + 1) % this.el.number.getVal() === 0)
|
218
|
+
|
219
|
+
{
|
220
|
+
|
221
|
+
temp.value += this.el.add.getVal();
|
222
|
+
|
223
|
+
temp.replaceCount++;
|
224
|
+
|
225
|
+
}
|
226
|
+
|
227
|
+
}
|
228
|
+
|
229
|
+
return temp;
|
230
|
+
|
231
|
+
};
|
232
|
+
|
233
|
+
|
234
|
+
|
235
|
+
Replace.prototype.showReplaceValue = function(v)
|
236
|
+
|
237
|
+
{
|
238
|
+
|
239
|
+
this.el.after.val(v.value);
|
240
|
+
|
241
|
+
alert(v.replaceCount + "個の「" + this.el.target.getVal() + "」を「" + this.el.target.getVal() + this.el.add.getVal() + "」に置換しました。");
|
242
|
+
|
243
|
+
};
|
244
|
+
|
245
|
+
|
246
|
+
|
247
|
+
function Elm(e)
|
248
|
+
|
249
|
+
{
|
250
|
+
|
251
|
+
this.el = $(e.element);
|
252
|
+
|
253
|
+
this.errorTxt = e.errorMsg;
|
254
|
+
|
255
|
+
this.val = "";
|
256
|
+
|
257
|
+
this.error = null;
|
258
|
+
|
259
|
+
}
|
260
|
+
|
261
|
+
Elm.prototype.setVal = function(){ this.val = this.el.val(); };
|
262
|
+
|
263
|
+
Elm.prototype.getVal = function(){ return this.val; };
|
264
|
+
|
265
|
+
Elm.prototype.isError = function()
|
266
|
+
|
267
|
+
{
|
268
|
+
|
269
|
+
this.error = null;
|
270
|
+
|
271
|
+
if(Array.isArray(this.errorTxt))
|
272
|
+
|
273
|
+
{
|
274
|
+
|
275
|
+
//only number
|
276
|
+
|
277
|
+
if(this.val === "") this.error = this.errorTxt[0];
|
278
|
+
|
279
|
+
else if(isNaN(this.val) || this.val < 0 || Math.round(this.val) != this.val) this.error = this.errorTxt[1];
|
280
|
+
|
281
|
+
}else if(this.val === "") this.error = this.errorTxt;
|
282
|
+
|
283
|
+
|
284
|
+
|
285
|
+
return (this.error != null) ? true : false;
|
286
|
+
|
287
|
+
};
|
288
|
+
|
289
|
+
Elm.prototype.getErrorMsg = function(){ return this.error; };
|
290
|
+
|
291
|
+
|
130
292
|
|
131
293
|
};
|
132
294
|
|
133
295
|
|
134
296
|
|
135
|
-
var clickSubmit = function()
|
136
|
-
|
137
|
-
{
|
138
|
-
|
139
|
-
var d = {};
|
140
|
-
|
141
|
-
d.before = el.before.val();
|
142
|
-
|
143
|
-
d.target = el.target.val();
|
144
|
-
|
145
|
-
d.add = el.add.val();
|
146
|
-
|
147
|
-
d.number = el.number.val();
|
148
|
-
|
149
|
-
d.error = [];
|
150
|
-
|
151
|
-
d.resultAry = [];
|
152
|
-
|
153
|
-
d.resultString = "";
|
154
|
-
|
155
|
-
d.length = 0;
|
156
|
-
|
157
|
-
d.replaceCount = 0;
|
158
|
-
|
159
|
-
//error check
|
160
|
-
|
161
|
-
if(d.before === "") d.error.push("「置換前」が空だよ\n");
|
162
|
-
|
163
|
-
if(d.target === "") d.error.push("「置換したい文字列」が空だよ\n");
|
164
|
-
|
165
|
-
if(d.add === "") d.error.push("「追加したい文字列」が空だよ\n");
|
166
|
-
|
167
|
-
if(d.number === "") d.error.push("「文字列何個置きに置換する?(数字)」が空だよ");
|
168
|
-
|
169
|
-
else if(isNaN(d.number)) d.error.push("「文字列何個置きに置換する?(数字)」が数字じゃないよ");
|
170
|
-
|
171
|
-
if(d.error.length > 0){ alert(d.error.join("")); return; }
|
172
|
-
|
173
|
-
//create ary
|
174
|
-
|
175
|
-
d.resultAry = d.before.split(d.target);
|
176
|
-
|
177
|
-
d.length = d.resultAry.length;
|
178
|
-
|
179
|
-
//error check
|
180
|
-
|
181
|
-
if(d.length <= 1) { alert("「置換したい文字列」で指定した「" + d.target + "」はないよ"); return; }
|
182
|
-
|
183
|
-
//replace
|
184
|
-
|
185
|
-
for (var i = 0; i < d.length; i++)
|
186
|
-
|
187
|
-
{
|
188
|
-
|
189
|
-
d.resultString += d.resultAry[i];
|
190
|
-
|
191
|
-
if(i === d.length - 1) break;
|
192
|
-
|
193
|
-
d.resultString += d.target;
|
194
|
-
|
195
|
-
if((i + 1) % d.number === 0)
|
196
|
-
|
197
|
-
{
|
198
|
-
|
199
|
-
d.resultString += d.add;
|
200
|
-
|
201
|
-
d.replaceCount++;
|
202
|
-
|
203
|
-
}
|
204
|
-
|
205
|
-
}
|
206
|
-
|
207
|
-
//add
|
208
|
-
|
209
|
-
el.after.val(d.resultString);
|
210
|
-
|
211
|
-
alert(d.replaceCount + "個の「" + d.target + "」を「" + d.target + d.add + "」に置換しました。");
|
212
|
-
|
213
|
-
};
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
init();
|
218
|
-
|
219
|
-
};
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
})(
|
297
|
+
})(gv || (gv = {}),jQuery);
|
224
|
-
|
298
|
+
|
225
|
-
</script>
|
299
|
+
</script>
|
226
|
-
|
300
|
+
|
227
|
-
</body>
|
301
|
+
</body>
|
228
302
|
|
229
303
|
</html>
|
230
304
|
|
7
ソースの修正
test
CHANGED
@@ -164,7 +164,7 @@
|
|
164
164
|
|
165
165
|
if(d.add === "") d.error.push("「追加したい文字列」が空だよ\n");
|
166
166
|
|
167
|
-
if(d.number ===
|
167
|
+
if(d.number === "") d.error.push("「文字列何個置きに置換する?(数字)」が空だよ");
|
168
168
|
|
169
169
|
else if(isNaN(d.number)) d.error.push("「文字列何個置きに置換する?(数字)」が数字じゃないよ");
|
170
170
|
|
6
ソースの修正
test
CHANGED
@@ -62,7 +62,7 @@
|
|
62
62
|
|
63
63
|
<p>
|
64
64
|
|
65
|
-
|
65
|
+
文字列何個置きに置換する?(数字)<br>
|
66
66
|
|
67
67
|
<input type="number" id="number" value="">
|
68
68
|
|
@@ -164,9 +164,9 @@
|
|
164
164
|
|
165
165
|
if(d.add === "") d.error.push("「追加したい文字列」が空だよ\n");
|
166
166
|
|
167
|
-
if(d.number === 0) d.error.push("「
|
167
|
+
if(d.number === 0) d.error.push("「文字列何個置きに置換する?(数字)」が空だよ");
|
168
|
-
|
168
|
+
|
169
|
-
else if(isNaN(d.number)) d.error.push("「
|
169
|
+
else if(isNaN(d.number)) d.error.push("「文字列何個置きに置換する?(数字)」が数字じゃないよ");
|
170
170
|
|
171
171
|
if(d.error.length > 0){ alert(d.error.join("")); return; }
|
172
172
|
|
5
誤字の修正
test
CHANGED
@@ -96,7 +96,7 @@
|
|
96
96
|
|
97
97
|
|
98
98
|
|
99
|
-
(function(
|
99
|
+
(function(replace,$){
|
100
100
|
|
101
101
|
|
102
102
|
|
4
誤字の修正
test
CHANGED
@@ -136,7 +136,7 @@
|
|
136
136
|
|
137
137
|
{
|
138
138
|
|
139
|
-
var d = {}
|
139
|
+
var d = {};
|
140
140
|
|
141
141
|
d.before = el.before.val();
|
142
142
|
|
3
誤字の修正
test
CHANGED
@@ -1,6 +1,6 @@
|
|
1
|
-
プログラム書いてみました。
|
1
|
+
プログラム書いてみました。ブラウザで開いていただければすぐ使えます。
|
2
|
-
|
2
|
+
|
3
|
-
|
3
|
+
以下の手順に沿って進めてみてください。
|
4
4
|
|
5
5
|
|
6
6
|
|
2
誤字の修正
test
CHANGED
@@ -1,10 +1,10 @@
|
|
1
|
-
プログラム書いてみました。
|
1
|
+
プログラム書いてみました。なんでもいいのでブラウザで開いて
|
2
|
-
|
2
|
+
|
3
|
-
使えます。以下の手順に沿って進めてみてください。
|
3
|
+
いただければ使えます。以下の手順に沿って進めてみてください。
|
4
|
-
|
5
|
-
|
6
|
-
|
4
|
+
|
5
|
+
|
6
|
+
|
7
|
-
1.
|
7
|
+
1. HTML内のコードをテキストエディタにコピペ。
|
8
8
|
|
9
9
|
2. ファイル名をindex.htmlにして保存
|
10
10
|
|
1
修正と追加
test
CHANGED
@@ -8,7 +8,9 @@
|
|
8
8
|
|
9
9
|
2. ファイル名をindex.htmlにして保存
|
10
10
|
|
11
|
-
3. ダブルクリックでそのファイルを開く
|
11
|
+
3. ダブルクリックでそのファイルを開く(ブラウザが立ち上がります)
|
12
|
+
|
13
|
+
4. 各項目を埋めて「置換スタート」ボタンを押す
|
12
14
|
|
13
15
|
|
14
16
|
|