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()使用总结的更多相关文章

  1. javascript 的button onclick事件不起作用的解决方法

    在项目中遇到个问题:servlet向前端返回如下按钮,当course_ID为数字是onclick事件正常,但当course_ID含有字母时onclick事件就不起作用.网上找了很多方法都不管用,最后自 ...

  2. uGUI使用代码动态添加Button.OnClick()事件(Unity3D开发之十二)

    猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/42705885 ...

  3. jsp button onclick

    <input type="button" value="MD5哈希转换" onclick="javascript:document.getEle ...

  4. ASP.NET通过JavaScript实现Button 的Enabled=false

    正常代码控制无法满足需求,所以记录一下方法: <input id="Button5" onclick=" CX()" type="button& ...

  5. href="javascript:function()" 和onclick的区别

    href='javascript:function()'和onclick能起到同样的效果,一般来说,如果要调用脚本还是在onclick事件里面写代码,而不推荐在href='javascript:fun ...

  6. javascript 动态改变onclick事件

    第一种:button.onclick = Function("alert('hello');"); 第二种:button.onclick = function(){alert(&q ...

  7. <a href="javascript:void(0)" onclick="ff()" ></a> 用法解析

    javascript:void(0) 仅仅表示一个死链接 如果是个# javascript:void(#),就会出现跳到顶部的情况,搜集了一下解决方法 1:<a href="####& ...

  8. <a href='javascript:void(0)' onclick='my()'></a>

  9. javascript 多个onclick function 取对应值

    方法1: 直接获取值 <button onclick="aa(1)">执行</button> <button onclick="aa(2)& ...

随机推荐

  1. 去除ios反调试

    在逆向过程中经常会遇到反调试,如下段代码: 0008bd8e movs r1, #0xa ; argument #2 for method imp___symbolstub1__dlopen 0008 ...

  2. 你以为你真的会用编辑器----之Emacs

    Emacs... -------------------------- EMACS,即Editor MACroS(编辑器宏)的缩写,Emacs,著名的集成开发环境和文本编辑器.Emacs被公认为是最受 ...

  3. 一篇文章读懂Java类加载器

    Java类加载器算是一个老生常谈的问题,大多Java工程师也都对其中的知识点倒背如流,最近在看源码的时候发现有一些细节的地方理解还是比较模糊,正好写一篇文章梳理一下. 关于Java类加载器的知识,网上 ...

  4. javascript如何用递归写一个简单的树形结构

    现在有一个数据,需要你渲染出对应的列表出来: var data = [ {"id":1}, {"id":2}, {"id":3}, {&qu ...

  5. Winform 下载服务器安装包并安装

    代码中包含了检测本地安装盘符代码 一,定义下载委托事件(用于实现前台进度条更新和下载完成后事件的回调): private delegate void Action(); private string ...

  6. Ext.grid.EditorGridPanel分页和查看全部

    在gridPanel添加查看全部数据按钮,必须使得每页显示的数量pageSize为总条数,那么总页数就只会有一页. 1.获取store数据的总条数 var totalCount = grid.getS ...

  7. docker的简单搭建(java/tomcat 环境)

    1.一副图简单了解下docker的布局,它是虚拟的,docker分为私服.镜像.容器三个模块 一般从私服pull镜像,镜像run一个容器,我们把容器作为一个虚拟服务,里面可以独立运行进程有独立的内网I ...

  8. kill -3 导出 thread dump

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt361 有些Java应用服务器是在控制台上运行,如Weblogic,为了方便获 ...

  9. C++学习日记(二)————初始字符串类型

    使用频率高,但操作复杂的数据有哪些? 做下总结: int; double;float;char;bool这些类型用的比较频繁,但并不复杂.但对于字符串来说(char数组)用的频繁但操作又复杂,只能用一 ...

  10. 第3阶段——内核启动分析之make menuconfig内核配置(2)

    目标: 分析make menuconfig内核配置过程 在上1小结中(内核编译试验)讲到了3种不同的配置: (1)通过make menuconfig 直接从头到尾配置.config文件 (2) 通过m ...