调用JavaScript函数易错点

最新推荐文章于 2023-08-24 09:20:26 发布

买火柴的小男孩

最新推荐文章于 2023-08-24 09:20:26 发布

阅读量1k

点赞数 1

分类专栏： JavaScript J2EE JSP

本文链接：https://blog.csdn.net/monstervsoutman/article/details/16890909

版权

J2EE 同时被 3 个专栏收录

7 篇文章 0 订阅

订阅专栏

JSP

5 篇文章 0 订阅

订阅专栏

JavaScript

1 篇文章 0 订阅

订阅专栏

本意是调用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>