JavaScriptの処理する箇所の指定が分からない

フォームの「名前」に「投稿」ボタン押下時、以下条件を満たす場合はエラー(javascript:alert)を表示し、投稿を中止・0文字・10文字以上」
「内容」に「投稿」ボタン押下時、以下条件を満たす場合はエラー(javascript:alert)を表示し、投稿を中止・0文字・300文字以上」
というような条件を加えたいんですが、各処理がどのフォームに実行されるのかというのを下記コードに書いてみたんですが、条件以内の投稿してもアラートが表示されてしまい、どのような処理をすればいいのか分からなくなりました
因みに各処理はPHPで$name = $_POST['name'];・$comment = $_POST['comment'];と定義してあるので$_POSTした値を受け取るという処理も同時に行いたいんです

HTML
1<html>
2	<head>
3		<meta http-equiv="content-type" content="text/html; charset=utf-8">
4
5		<script type="text/javascript">
6			function chk($name) {
7				if (1 >= 9) {
8					return true;
9				} else {
10					alert("ERROR");
11					return false;
12				}
13			}
14		</script>
15		<script type="text/javascript">
16			function chk($comment) {
17				if (1 >= 299) {
18					return true;
19				} else {
20					alert("ERROR");
21					return false;
22				}
23			}
24		</script>
25
26	</head>
27	<body>
28		<form method="post" action="" onSubmit="return chk(name, comment)">
29			<table>
30				<tr>
31					<td>
32						名前：<input type="text" name="name">
33						内容：<textarea name="comment" cols="30" rows="3"></textarea>
34						<input type="radio" name="bbs" value="post" checked>投稿
35						<input type="radio" name="bbs" value="update">更新
36						<input type="radio" name="bbs" value="delete">削除
37						<input type="submit" value="投稿">
38						<input type="submit" value="更新">
39						<input type="submit" value="削除">
40					</td>
41				</tr>
42			</table>
43
44<?php
45			while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
46?>
47
48			<table>
49				<input type="checkbox" name="chkid[]" value="<?=$row['id'] ?>">
50				<tr>
51					<td>名前：
52						<?php echo $row['name'] ?>
53					</td>
54				</tr>
55				<tr>
56					<td>内容：
57						<?php echo $row['comment'] ?>
58					</td>
59				</tr>
60			</table>
61
62<?php
63			}
64			mysqli_free_result($result);
65
66			mysqli_close($link);
67?>
68
69		</form>
70	</body>
71</html>

行動規範の内容に同意します

回答1件

ベストアンサー

<form method="post" action="" onSubmit="return chk(name, comment)">

chkに渡してる引数がnameとcommentの２つなのに、

function chk($name) {

受け取る側の引数が１つしかないのがおかしいです。

というか

function chk($comment) {

と、chk関数が2つあるのもおかしいです。

それと

if (1 >= 9) {

と

 if (1 >= 299) {

の部分も、falseにしかならないですよね。

chk関数の引数をnameとcommentの2つにして、
中身でそれぞれの文字の長さを取得して、その長さを判定すればOKです。

投稿2016/08/18 05:20

jm1156

総合スコア866

a-_.

2016/08/18 05:28

ご回答ありがとうございます >中身でそれぞれの文字の長さを取得して、その長さを判定すればOK どういう意味かもう少し分かりやすく教えていただけますか

jm1156

2016/08/18 05:29

lengthで文字の長さを取得して、それをif文で判定すればOKです http://javascriptist.net/ref/String.length.html

a-_.

2016/08/18 06:54

サイトを参考に下記コードに訂正してみましたが、getElementById("");でformとtableタグ内に絞っていこうかと思ったんですが、フォーム以外のコードも混ざってしまって範囲を限定できないですこの場合どうすればいいのでしょうか <script type="text/javascript"> function check() { var contents = document.getElementById("form"); for(f=0; f<contents.length; f++) { if ((contents.elements[f].name=="name") && (contents.elements[f].name=="comment") && (contents.elements[f].value=="")) { alert("ERROR"); return false; } } contents.submit(); }

jm1156

2016/08/18 07:04

関数にしたのにgetElementByIdを使うのですか？引数で渡すのでは？ function chk(name,comment) で if (name.length >= 9) { とか if (comment.length >= 299) { でいいと思うのですが。そもそも比較演算子が逆なきもしますけど…。

a-_.

2016/08/18 07:18

・if (name.length >= 9) { ・if (comment.length >= 299) { の{}内にはalertを書いた方がいいという事ですかあと、比較演算子が逆とはどういう意味でしょうか

jm1156

2016/08/18 07:27

試してないけど、こうかな function chk(name,comment) { if ( 0 < name.length && name.length < 10 && 0 < comment.length && comment.length < 300 ) { return true; } else { alert("ERROR"); return false; } }

a-_.

2016/08/18 07:46

教えていただいたコードで試しましたが、アラート表示されませんでした