JavaScript配合button.onclick()使用总结
Html加载顺序是从上往下加载，如果script中含有引用js脚本，则应该将此script放在head标签里面，这样可是保证此页面都可以引用js脚本内容。如果想在script中设置button.onclick()事件，则此script应放在button声明之后。
例子：index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"
contentType="text/html; charset=UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head> <title>javaScript和button.onclick()事件</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- 全文相关的script脚本（包括引用的script文件）放在head标签中 -->
<script type="text/javascript" src="include.js">
function fun1() {
alert("第一种script方式显示时间是：" + Date());
}
</script>
</head> <body>
<button id="button11" onclick="fun1()">第一种script方式显示时间</button>
<button id="button12" onclick="fun2()">通过引用js文件显示时间</button>
<button id="button2">第二种script方式显示时间</button>
<button id="button3">第三种script方式显示时间</button>
<script>
document.getElementById("button2").onclick = function() {
displayDate()
};
document.getElementById("button3").onclick = displayDate2;
function displayDate() {
document.getElementById("demo").innerHTML = "第二种script方式显示时间是："
+ Date();
}
function displayDate2() {
document.getElementById("demo2").innerHTML = "第三种script方式显示时间是："
+ Date();
}
</script>
<br>时间一：
<p id="demo"></p>
时间二：
<p id="demo2"></p>
</body>
</html>
include.js
function fun2() {
alert("通过引用js文件显示时间是：" + Date());
}
输入网址：http://localhost:8080/Test/index.jsp，截图如下
JavaScript配合button.onclick()使用总结的更多相关文章
- javascript 的button onclick事件不起作用的解决方法
在项目中遇到个问题:servlet向前端返回如下按钮,当course_ID为数字是onclick事件正常,但当course_ID含有字母时onclick事件就不起作用.网上找了很多方法都不管用,最后自 ...
- uGUI使用代码动态添加Button.OnClick()事件（Unity3D开发之十二）
猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/42705885 ...
- jsp button onclick
<input type="button" value="MD5哈希转换" onclick="javascript:document.getEle ...
- ASP.NET通过JavaScript实现Button 的Enabled=false
正常代码控制无法满足需求,所以记录一下方法: <input id="Button5" onclick=" CX()" type="button& ...
- href="javascript:function()" 和onclick的区别
href='javascript:function()'和onclick能起到同样的效果,一般来说,如果要调用脚本还是在onclick事件里面写代码,而不推荐在href='javascript:fun ...
- javascript 动态改变onclick事件
第一种:button.onclick = Function("alert('hello');"); 第二种:button.onclick = function(){alert(&q ...
- <a href="javascript:void(0)" onclick="ff()" ></a> 用法解析
javascript:void(0) 仅仅表示一个死链接 如果是个# javascript:void(#),就会出现跳到顶部的情况,搜集了一下解决方法 1:<a href="####& ...
- <a href='javascript:void(0)' onclick='my()'></a>
- javascript 多个onclick function 取对应值
方法1: 直接获取值 <button onclick="aa(1)">执行</button> <button onclick="aa(2)& ...
随机推荐
- koa2 controller中实现类似sleep的延迟功能
今天有同事问我如何在koa2中的controller中使用延迟执行的功能,他直接在controller中使用setTimeout,但是没效果. 错误的代码类似下面这样: // 错误的方法 export ...
- CentOS下安装JDK7
下载地址:http://www.oracle.com/technetwork/java/javase/downloads/java-se-jdk-7-download-432154.html 1. 安 ...
- 在Linux下安装eclipse
在Linux下安装eclipse 今天上午终于在Linux下把eclipse安装上去了,前几天尝试了一次,失败了,不知道是软件版本的问题还是我自己的原因,估计还是我自己的原因占多数!下面把这次成功的经 ...
- Ext.NET webform
Ext.NET是基于跨浏览器的ExtJS库和.NET Framework的一套支持ASP.NET AJAX的非开源Web控件,包含有丰富的Ajax运用,其前身是Coolite[1] .
- MySQL 账户管理
一.当前日期.当前用户.当前数据库版本 mysql> select curdate(),version(),database(),user(); +------------+---------- ...
- Quartz总结
前言 最近项目中有使用到Quartz,得空便总结总结,顺便记录一下这种设计模式,毕竟"好记性不如烂笔头". 搭建 pom文件: <dependency> <gro ...
- Linux入门练习
1.echo是用于终端打印的基本命令: 1.1echo默认将一个换行符追加到输出文本的尾部. 1.2 echo中转义换行符 如需使用转义序列,则采用echo -e "包含转义序列的字符串&q ...
- Java基础---String类和基本数据类型包装类
第一讲 String类 一.概述 String是字符串的类类型,用于描述字符串事物.字符串是一个特殊的对象.特殊之处就在于: Stings= new String();和Str ...
- linux（十三）之磁盘分区、创建文件系统、挂载
前面学习了linux的用户管理 ,感觉是不是多lnux的多用户多任务的系统感觉十分了解了,但是其实并不然的.你还需要了解更多.接下来给大家分享的是 在vmware中添加硬盘创建分区,然后挂载到指定目录 ...
- 关于makefile中变量的多次赋值以及override指令
1 基本原则如下 1.1 原则1 变量的普通赋值是有先后顺序的,后面的赋值会覆盖掉前面的赋值. 1.2 原则2 使用的时候,用的是其前面最后的赋值,就算其后面有使用了override指令的赋值也不会影 ...