質問編集履歴
6
修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,4 +1,3 @@
|
|
1
|
-
[リンク内容](https://teratail.com/questions/96420)
|
2
1
|
【質問したいこと】
|
3
2
|
フォーカスが外れた際と指定時間経過した後に入力項目におけるチェック処理を実装しましたが、JavaScriptにexitなる関数、処理がないためどちらも呼ばれてしまいalertで表示しているエラーメッセージが2度表示されてしまう。
|
4
3
|
|
5
質問の追記。修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -8,7 +8,7 @@
|
|
8
8
|
指定時間経過時にもチェックを行いたい。
|
9
9
|
|
10
10
|
【実装した内容、考えていること】
|
11
|
-
```JavaScript
|
11
|
+
```JavaScript(main.js)
|
12
12
|
function isTimecheck() {
|
13
13
|
setTimeout("onAutoSave()", 指定時間);
|
14
14
|
}
|
@@ -16,8 +16,9 @@
|
|
16
16
|
function onAutoSave() {
|
17
17
|
var result = true;
|
18
18
|
var a = 入力項目.value; //入力項目の入力値を取得する。
|
19
|
+
var maxLen = 20; //最大文字数:例で20とする。
|
19
20
|
if (a != '') {
|
20
|
-
result =
|
21
|
+
result = WordCountCheck(a, maxlen);
|
21
22
|
if (result == false) {
|
22
23
|
alert(エラーメッセージ);
|
23
24
|
入力項目.focus(); //フォーカスを入力項目に戻す。
|
@@ -29,15 +30,34 @@
|
|
29
30
|
isTimeCheck();
|
30
31
|
}
|
31
32
|
```
|
33
|
+
```JavaScript(check.js)
|
34
|
+
function WordCountCheck(str, maxLength) {
|
35
|
+
var i = 0;
|
36
|
+
var len = 0; //バイト数を格納する。
|
37
|
+
str.value = rightTrim(str.value);//不要な右側スペースは削除する。
|
38
|
+
var val = str.value;
|
39
|
+
if(val !=""){
|
40
|
+
for(; i<val.length; i++) {
|
41
|
+
半角なら1バイトなので1をlenに加算。
|
42
|
+
全角なら2バイトなので2をlenに加算。
|
43
|
+
}
|
44
|
+
if(maxLength < len){
|
45
|
+
alert(エラーメッセージ);
|
46
|
+
str.focus(); //フォーカスを入力項目に戻す。
|
47
|
+
return false;
|
48
|
+
}
|
49
|
+
}
|
50
|
+
}
|
32
|
-
```
|
51
|
+
```
|
52
|
+
```html(Test.html)
|
33
53
|
<TD>
|
34
|
-
<textarea cols="" rows="" name="" style="" onBlur="
|
54
|
+
<textarea cols="" rows="" name="" style="" onBlur="WordCountCheck(this, 20);">入力項目</textarea>
|
35
55
|
</TD>
|
36
56
|
```
|
37
57
|
このHTML部分を
|
38
58
|
```html
|
39
59
|
<TD>
|
40
|
-
<textarea cols="" rows="" name="" style="" onChange="
|
60
|
+
<textarea cols="" rows="" name="" style="" onChange="WordCountCheck(this, 20);">入力項目</textarea>
|
41
61
|
</TD>
|
42
62
|
```
|
43
63
|
このようにした場合、onBlurのときと同じデータで試した際に1度のみポップアップが出ていたのですがこれだと値が変わってエラーメッセージが出た後に変更しないでフォーカスアウトした場合などにチェックできないので不満足になってしまいます。
|
@@ -57,13 +77,13 @@
|
|
57
77
|
【試してみたこと】
|
58
78
|
```html
|
59
79
|
onBlur部分を以下のよう(見やすくするためJSに記載しています。)にしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。onAutoSaveが先に呼ばれていたようなので、そこでチェックエラーとなった場合はonBlurの処理を行わないようにグローバル変数のcheckFlgをtrueにするようにしてみました。しかし、alertが2回出てしまいます。
|
60
|
-
onBlur="isLostFocusCheck();"
|
80
|
+
onBlur="isLostFocusCheck(this);"
|
61
81
|
```
|
62
82
|
```JavaScript
|
63
83
|
var checkFlg=false;
|
64
|
-
function isLostFocusCheck() {
|
84
|
+
function isLostFocusCheck(str) {
|
65
85
|
if(checkFlg==false) { //自動保存でチェックエラーとなっていた場合はcheckFlgがtrueとなっているためこのifはスルーされるはず。
|
66
|
-
|
86
|
+
WordCountCheck(str, 20);
|
67
87
|
}
|
68
88
|
}
|
69
89
|
```
|
4
修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -56,9 +56,14 @@
|
|
56
56
|
~質問追加~
|
57
57
|
【試してみたこと】
|
58
58
|
```html
|
59
|
-
onBlur部分を以下のようにしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。
|
60
|
-
onBlur="
|
59
|
+
onBlur部分を以下のよう(見やすくするためJSに記載しています。)にしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。onAutoSaveが先に呼ばれていたようなので、そこでチェックエラーとなった場合はonBlurの処理を行わないようにグローバル変数のcheckFlgをtrueにするようにしてみました。しかし、alertが2回出てしまいます。
|
60
|
+
onBlur="isLostFocusCheck();"
|
61
61
|
```
|
62
|
+
```JavaScript
|
62
|
-
|
63
|
+
var checkFlg=false;
|
64
|
+
function isLostFocusCheck() {
|
63
|
-
|
65
|
+
if(checkFlg==false) { //自動保存でチェックエラーとなっていた場合はcheckFlgがtrueとなっているためこのifはスルーされるはず。
|
64
|
-
|
66
|
+
チェック処理;
|
67
|
+
}
|
68
|
+
}
|
69
|
+
```
|
3
修正追加依頼の対応
title
CHANGED
File without changes
|
body
CHANGED
@@ -25,6 +25,9 @@
|
|
25
25
|
}
|
26
26
|
}
|
27
27
|
}
|
28
|
+
window.onload = function(){
|
29
|
+
isTimeCheck();
|
30
|
+
}
|
28
31
|
```
|
29
32
|
```html
|
30
33
|
<TD>
|
2
試してみたことを追加
title
CHANGED
File without changes
|
body
CHANGED
@@ -48,4 +48,14 @@
|
|
48
48
|
|
49
49
|
そもそも、この実装の場合onBlurとonAutoSaveは指定時間経過後にはどちらが先に実行されるのでしょうか?
|
50
50
|
|
51
|
-
知恵をお持ちの方がいましたら、ご教示お願いいたします。
|
51
|
+
知恵をお持ちの方がいましたら、ご教示お願いいたします。
|
52
|
+
|
53
|
+
~質問追加~
|
54
|
+
【試してみたこと】
|
55
|
+
```html
|
56
|
+
onBlur部分を以下のようにしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。
|
57
|
+
onBlur="var result=false;result=true;if(result==false)チェック処理;"
|
58
|
+
```
|
59
|
+
result=true;
|
60
|
+
の部分を指定時間が経過したらtrueとなるように出来れば指定時間前はfalseのためonBlurのチェックが効いて、指定時間経過時にtrueとなるため実現可能かと思いますが
|
61
|
+
その際にsetTimeoutを使用すればよいかと思いますが、setTimeoutで呼んだ先の関数でフラグをONにしたいのですが時間経過しているかどうかの判断はどのように行えばよいのでしょうか?
|
1
質問内容の変更
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,8 +1,4 @@
|
|
1
1
|
[リンク内容](https://teratail.com/questions/96420)
|
2
|
-
|
3
|
-
こちらの類似質問となるのですが、質問欄がわかりにくくなってしまったので
|
4
|
-
向こうは一度クローズし、改めてスポットを当てて質問させていただきます。
|
5
|
-
|
6
2
|
【質問したいこと】
|
7
3
|
フォーカスが外れた際と指定時間経過した後に入力項目におけるチェック処理を実装しましたが、JavaScriptにexitなる関数、処理がないためどちらも呼ばれてしまいalertで表示しているエラーメッセージが2度表示されてしまう。
|
8
4
|
|