###前提・実現したいこと
検索フォームのテキストボックス（<input type="text" name="search" value="">）に値を入力し、検索ボタン（<input type="submit" value="検索">）を押すと、値によって異なるアラートが表示されるようにしたいです。
入力された値に半角数字以外が含まれている（ああ）（1あ） →「エラー」という文言をアラートで表示、検索は実行されない
半角数字のみ（123） → 入力された値（半角数字）をそのまま（123）アラートとして表示、検索が実行される

###発生している問題・エラーメッセージ
アラートが表示されず、検索が実行されます。

###該当のソースコード

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>	
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<meta name="keywords" content="">
	<meta name="description" content="">
	<meta http-equiv="content-style-type" content="text/css">
	<meta http-equiv="content-script-type" content="text/javascript">
	<link rel="stylesheet"  href="style.css">
	<link href="./style.css" rel="stylesheet" type="text/css">
	<title></title>
	<script type="text/javascript"> 
	<!-- 
	function check(){
		var flag = 0;
		// 設定開始（チェックする項目を設定してください）
		if(document.form1.search1.value.match(/[^0-9]+/)){
			flag = 1;
		}
		// 設定終了
		if(flag){
			window.alert('エラー'); // 数字以外が入力された場合は警告ダイアログを表示
			return false; // 送信を中止
		}
		else{
		alert(document.querySelector("[name=\"search1\"]").value);
			return true; // 送信を実行

		}
	}
	// -->
	</script>
	<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="crossorigin="anonymous"></script>


</head>
<body>
		<div class="form">
				<form method="POST" action="example.cgi" name="form1" onSubmit="check(this)">
					<p>検索したいキーワードを入力してください。</p>
					<input type="text" name="search1" value="">
					<input type="submit" value="検索">
				</form>
			</div>
</body>
</html>

「追記」エラーのアラートが表示された後にも検索が実行されてしまいます。
onSubmit="check(this)"の後にreturn false;を記述すると、半角数字を入力したときの検索が実行されなくなります。
エラーの（半角数字以外を含む）ときだけ検索を中止したいです。

###試したこと
http://www.tagindex.com/javascript/form/check2.html を参考に記述いたしました。

kei344

2017/06/15 18:04

質問文のコードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

kei344

2017/06/15 18:24

バッククオート3つの前後には改行を入れてください。記入エリアの右部分あたりにリアルタイムに結果が表示されていると思うので、そこを見ながら調整してください。

coco2

2017/06/15 18:30

ご丁寧にありがとうございます。

kei344

2017/06/15 18:50

回答が付いた質問の編集は慎重に行ってください。質問文のコードについて回答にて指摘があった場合は「追記」し、元のコードを編集する場合も「直したこと」がわかるようにしてください。

coco2

2017/06/15 19:00

申し訳ございません。気をつけます。

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

回答2件

onsubmitのところでjavascriptでreturnされるfalseを受ける記述が必要です。

html
1onSubmit="check(this)"
2↓
3onSubmit="return check(this)"
4または
5onSubmit="check(this);return false;"

追記

せっかくjQueryを読み込ませているので使用するともっと楽に書けそうです。

※こういう書き方もあるよという一例として参考にしてください

読み込み順番は下記のようにjQuery読み込みを優先にする

HTML
1<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="crossorigin="anonymous"></script>
2<script type="text/javascript"> 
3//以下省略

htmlのフォーム要素にそれぞれID振る

html
1<form method="POST" action="example.cgi" name="form1" id="form1">
2<input type="text" name="search1" id="search1" value="">

※id振らなくても利用可能ですがその方が分かりやすくなるので
※submitもjQueryで感知するのでonSubmitもなし

javascript
1//Formの送信イベントを捕捉
2$('#form1').on('submit',function(){
3     //入力値を取得
4     searchtext = $('#search1').val();
5    //入力チェック
6    if(searchtext.match(/[^0-9]+/)){
7        alert('エラー');
8        return false; //送信取りやめ
9    }else{
10        //入力値を表示
11        alert(searchtext);
12        //falseをreturnしていないのでそのままsubmitが実行される
13    }
14})