質問編集履歴

6

修正

2017/10/17 02:14

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -1,5 +1,3 @@
1
- [リンク内容](https://teratail.com/questions/96420)
2
-
3
1
  【質問したいこと】
4
2
 
5
3
  フォーカスが外れた際と指定時間経過した後に入力項目におけるチェック処理を実装しましたが、JavaScriptにexitなる関数、処理がないためどちらも呼ばれてしまいalertで表示しているエラーメッセージが2度表示されてしまう。

5

質問の追記。修正

2017/10/17 02:14

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -18,7 +18,7 @@
18
18
 
19
19
  【実装した内容、考えていること】
20
20
 
21
- ```JavaScript
21
+ ```JavaScript(main.js)
22
22
 
23
23
  function isTimecheck() {
24
24
 
@@ -34,9 +34,11 @@
34
34
 
35
35
  var a = 入力項目.value; //入力項目の入力値を取得する。
36
36
 
37
+ var maxLen = 20; //最大文字数:例で20とする。
38
+
37
39
  if (a != '') {
38
40
 
39
- result = チェック処理(a);
41
+ result = WordCountCheck(a, maxlen);
40
42
 
41
43
  if (result == false) {
42
44
 
@@ -60,11 +62,49 @@
60
62
 
61
63
  ```
62
64
 
65
+ ```JavaScript(check.js)
66
+
67
+ function WordCountCheck(str, maxLength) {
68
+
69
+ var i = 0;
70
+
71
+ var len = 0; //バイト数を格納する。
72
+
73
+ str.value = rightTrim(str.value);//不要な右側スペースは削除する。
74
+
75
+ var val = str.value;
76
+
77
+ if(val !=""){
78
+
79
+ for(; i<val.length; i++) {
80
+
81
+ 半角なら1バイトなので1をlenに加算。
82
+
83
+ 全角なら2バイトなので2をlenに加算。
84
+
85
+ }
86
+
87
+ if(maxLength < len){
88
+
89
+ alert(エラーメッセージ);
90
+
91
+ str.focus(); //フォーカスを入力項目に戻す。
92
+
93
+ return false;
94
+
95
+ }
96
+
97
+ }
98
+
99
+ }
100
+
63
- ```html
101
+ ```
102
+
103
+ ```html(Test.html)
64
104
 
65
105
  <TD>
66
106
 
67
- <textarea cols="" rows="" name="" style="" onBlur="チェック処理">入力項目</textarea>
107
+ <textarea cols="" rows="" name="" style="" onBlur="WordCountCheck(this, 20);">入力項目</textarea>
68
108
 
69
109
  </TD>
70
110
 
@@ -76,7 +116,7 @@
76
116
 
77
117
  <TD>
78
118
 
79
- <textarea cols="" rows="" name="" style="" onChange="チェック処理">入力項目</textarea>
119
+ <textarea cols="" rows="" name="" style="" onChange="WordCountCheck(this, 20);">入力項目</textarea>
80
120
 
81
121
  </TD>
82
122
 
@@ -116,7 +156,7 @@
116
156
 
117
157
  onBlur部分を以下のよう(見やすくするためJSに記載しています。)にしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。onAutoSaveが先に呼ばれていたようなので、そこでチェックエラーとなった場合はonBlurの処理を行わないようにグローバル変数のcheckFlgをtrueにするようにしてみました。しかし、alertが2回出てしまいます。
118
158
 
119
- onBlur="isLostFocusCheck();"
159
+ onBlur="isLostFocusCheck(this);"
120
160
 
121
161
  ```
122
162
 
@@ -124,11 +164,11 @@
124
164
 
125
165
  var checkFlg=false;
126
166
 
127
- function isLostFocusCheck() {
167
+ function isLostFocusCheck(str) {
128
168
 
129
169
  if(checkFlg==false) { //自動保存でチェックエラーとなっていた場合はcheckFlgがtrueとなっているためこのifはスルーされるはず。
130
170
 
131
- チェック処理;
171
+ WordCountCheck(str, 20);
132
172
 
133
173
  }
134
174
 

4

修正

2017/10/17 01:22

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -114,14 +114,24 @@
114
114
 
115
115
  ```html
116
116
 
117
- onBlur部分を以下のようにしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。
117
+ onBlur部分を以下のよう(見やすくするためJS記載しています。)にしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。onAutoSaveが先に呼ばれていたようなので、そこでチェックエラーとなった場合はonBlurの処理を行わないようにグローバル変数のcheckFlgをtrueにするようにしてみました。しかし、alertが2回出てしまいます。
118
118
 
119
- onBlur="var result=false;result=true;if(result==false)チェック処理;"
119
+ onBlur="isLostFocusCheck();"
120
120
 
121
121
  ```
122
122
 
123
- result=true;
123
+ ```JavaScript
124
124
 
125
- の部分を指定時間が経過したらtrueとなるように出来れば指定時間前はfalseのためonBlurのチェックが効いて、指定時間経過時にtrueとなるため実現可能かと思いますが
125
+ var checkFlg=false;
126
126
 
127
+ function isLostFocusCheck() {
128
+
127
- その際にsetTimeoutを使用すればよいかと思いますが、setTimeout呼んだ先の関数でフグをONにしいのです時間経過しているかどうか判断どのように行えばよいのでしょうか?
129
+ if(checkFlg==false) { //自動保存チェックエーとなってい場合はcheckFlgtrueとなっているためこifスルーされるはず。
130
+
131
+ チェック処理;
132
+
133
+ }
134
+
135
+ }
136
+
137
+ ```

3

修正追加依頼の対応

2017/10/17 00:36

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -49,6 +49,12 @@
49
49
  }
50
50
 
51
51
  }
52
+
53
+ }
54
+
55
+ window.onload = function(){
56
+
57
+ isTimeCheck();
52
58
 
53
59
  }
54
60
 

2

試してみたことを追加

2017/10/17 00:27

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -99,3 +99,23 @@
99
99
 
100
100
 
101
101
  知恵をお持ちの方がいましたら、ご教示お願いいたします。
102
+
103
+
104
+
105
+ ~質問追加~
106
+
107
+ 【試してみたこと】
108
+
109
+ ```html
110
+
111
+ onBlur部分を以下のようにしてみたところ、当然ロストフォーカス時にはチェックがかからず、指定時間経過時もチェックはかからない。
112
+
113
+ onBlur="var result=false;result=true;if(result==false)チェック処理;"
114
+
115
+ ```
116
+
117
+ result=true;
118
+
119
+ の部分を指定時間が経過したらtrueとなるように出来れば指定時間前はfalseのためonBlurのチェックが効いて、指定時間経過時にtrueとなるため実現可能かと思いますが
120
+
121
+ その際にsetTimeoutを使用すればよいかと思いますが、setTimeoutで呼んだ先の関数でフラグをONにしたいのですが時間経過しているかどうかの判断はどのように行えばよいのでしょうか?

1

質問内容の変更

2017/10/16 07:38

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -1,12 +1,4 @@
1
1
  [リンク内容](https://teratail.com/questions/96420)
2
-
3
-
4
-
5
- こちらの類似質問となるのですが、質問欄がわかりにくくなってしまったので
6
-
7
- 向こうは一度クローズし、改めてスポットを当てて質問させていただきます。
8
-
9
-
10
2
 
11
3
  【質問したいこと】
12
4