JavaScript配合button.onclick()使用總結

本文轉載自查看原文 2016-08-05 13:26 6250 Java/ JavaScript

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，截圖如下

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 HTML Button.onclick 事件匯總 javaweb使用button的onclick屬性訪問servlet 關於Button中的onClick屬性通過Button的OnClick來獲取到當前點擊的是哪個Button 使用onclick跳轉到其他頁面。使用button跳轉到指定url JavaScript 函數和事件 (onclick/) button的onclick事件給函數傳遞參數 Android開發中Button的onClick實現 Button的onClickListener常用方法之android：onclick屬性 asp.net button的OnClick和OnClientClick事件