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)& ...
随机推荐
- 《高性能Mysql》翻译错误
原文中在分区表中的一句话翻译错误,如下 应该是[扫描列a上的索引就需要扫描每一个分区内对应的索引树],英文版描述如下: ''' Suppose you define an index on a and ...
- DesignPatternPrinciple（设计模式原则）一
设计模式六大原则(1):单一职责原则 定义:不要存在多于一个导致类变更的原因.通俗的说,即一个类只负责一项职责. 问题由来:类T负责两个不同的职责:职责P1,职责P2.当由于职责P1需求发生改变而需 ...
- [js高手之路]原型对象(prototype)与原型链相关属性与方法详解
一,instanceof: instanceof检测左侧的__proto__原型链上,是否存在右侧的prototype原型. 我在之前的两篇文章 [js高手之路]构造函数的基本特性与优缺点 [js高手 ...
- 【Centos 7】使用screen恢复终端连接
操作系统:centos7.1 (在ubuntu上测试过,不支持 screen) 主机:虚拟云主机 问题出现:在使用打包式在线安装phpstudy时,由于安装过程非常漫长,http报文过一段时间没有回送 ...
- 9.19.1 反射构造Class对象
构造Class对象的三种方式: 第一种方式: (1)对于系统的类,必须写全名! (2)该方式会将.Cla ...
- iOS开发笔记17：自定义相机拍照
之前用AVFoundation自定义相机做了拍照与视频相关的东西,为什么要自定义呢?主要是提供更个性化的交互设计,符合app主题,对于视频来说,也便于提供更多丰富有趣的功能.前段时间整理了下拍照部分的 ...
- 迈向angularjs2系列(5):依赖注入
一: 为什么要依赖注入 1.构造器引入依赖 假设一个类Car类依赖于Engine(引擎)类.Transition(变速箱)类,可使用构造器来完成. //类似如下代码 class Engine{} cl ...
- Markdown最佳实践
Markdown 最佳实践 结合目前看到的信息,总结使用Markdown的最方便的方式. 我的需求是: 能够配合各种笔记软件使用,目前主要使用的是为知笔记和有道笔记.笔记的内容需要记录代码及数学公式, ...
- JSON取值(key是中文或者数字)方式详解
JSON取值(key是中文或者数字)方式详解 先准备一个json对象用于演示 var json = {'name':'zhangsan', '年龄':23, 404:'你可能迷路了'}; 使用JS中w ...
- Django1-10-5管理界面中文设置
先确定一下版本是否更高,低版本设置(settings.py文件): LANGUAGE_CODE = 'zh-CN'TIME_ZONE = 'Asia/Shanghai' 但是新版本就会提示不识别zh- ...