調用JavaScript函數易錯點

本意是調用JavaScript定義的validate方法判斷多選框中是否沒有任何被選中的框,若是,則不跳轉,並彈出對話框提醒

源代碼如下

html界面

<%@ page language="java" contentType="text/html;charset=UTF-8"

   pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<script type="text/javascript"src="../js/Option_Check.js"></script>

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<title>Insert title here</title>

</head>

<body>

    <formaction="Success.jsp" onSubmit="validate(this)">

       <inputtype="checkbox" name="check" value="badman"/><b>badman</b>

       <inputtype="checkbox" name="check" value="superman"/><b>superman</b>

       <inputTYPE="submit" value="ok" />

    </form>

</body>

</html>


 

 

js代碼

function validate(f){

 var field=f.check;

 var i=0;

 for(;i<field.length;i++){

  if(field[i].checked){

   

   return true;

  }

 }

 alert("未選擇任何一項");

 return false;

}


 


結果能彈出一個對話框提示“未選擇任何一項”,但是點擊確定後依舊轉移到Success.jsp界面

錯誤在於調用的方式錯了(onSubmit="validate(this)")

受Java的影響,調用有返回數據的方法直接調用即可,但是JavaScript中需要加上return關鍵字才能得到函數返回的值

 

正確的html語句

<%@ page language="java" contentType="text/html;charset=UTF-8"

   pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<script type="text/javascript"src="../js/Option_Check.js"></script>

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<title>Insert title here</title>

</head>

<body>

    <formaction="Success.jsp" onSubmit="return validate(this)">

       <inputtype="checkbox" name="check" value="badman"/><b>badman</b>

       <inputtype="checkbox" name="check" value="superman"/><b>superman</b>

       <inputTYPE="submit" value="ok" />

    </form>

</body>

</html>


 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章