单击时,OnClick属性不起作用

时间:2020-05-20 04:23:05

标签: javascript html

我在onclick函数上遇到问题,我正在尝试运行以下代码。我正在尝试单击按钮时更改文本。

JS

function close() {
  document.getElementById('closed').innerHTML = 'We are not ready yet!';
  console.warn('I am working boss');
}

HTML

<!DOCTYPE html>
<html>
<head>
    <title>AFLRP is now AUG</title>

<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicons/favicon-16x16.png">
<link rel="manifest" href="/assets/favicons/site.webmanifest">
<link rel="shortcut icon" href="/assets/favicons/favicon.ico">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="msapplication-config" content="/assets/favicons/browserconfig.xml">
<meta name="theme-color" content="#0063bf">
    <link rel="stylesheet" type="text/css" href="cssKits/generalKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/navbarKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/loadingKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/fontKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/contentKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/gridKit.css">
    <link rel="stylesheet" type="text/css" href="cssKits/loadingKit.css">
     <meta charset="UTF-8">
     <meta name="keywords" content="Flashing Lights,RP,Role Play,FL, Australia, Australian, Police, Fire, EMS, Paramedic">
     <meta name="author" content="AFLRP Web Division">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Enjoy a great Role Play with Aussie Flashing Lights Role Play, be a police officer, fire fighter or EMT and have fun with friends!">
</head>
<body onload="timeOutCheck()" style="margin: 0;">

    <div id="loader"></div>
    <div id="page" style="display: none;">
    <div id="nav">
        <div id="navItem"><a href="index.html" class="navLinkActive">Home</a></div>
        <div id="navItem"><a href="contact.html" class="navLink">Contact</a></div>
        <div id="navItem"><a href="join.html" class="navLink">Join</a></div>
        <div id="navItem"><a href="about.html" class="navLink">About</a></div>
        <div id="navItem"><a href="resources.html" class="navLink">Resources</a></div>
    </div>
    <div id="mainBodyContent" align="center">
    <h1>AFLRP is now Aussie Games</h1>
    <p>AFLRP is becoming Aussie Games, so right now we are not accepting new members and or messages, once we are ready (July 10), we will change this to invite you to AUG</p>
    <button class="disabled" id='closed' onclick="close()" > Join Aussie Games today!"</button>
    </div>

</div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>

但是它不会更改文本或输出我的测试警告。

2 个答案:

答案 0 :(得分:4)

close()是DOM method。尝试将其更改为其他内容

答案 1 :(得分:2)

close()是本机JS方法-> window.close()。 您可能要更改函数名称。

function closeInvite() {
  document.getElementById('closed').innerHTML = 'We are not ready yet!';
  console.warn('I am working boss');
}
<div id="mainBodyContent" align="center">
  <h1>AFLRP is now Aussie Games</h1>
  <p>AFLRP is becoming Aussie Games, so right now we are not accepting new members and or messages, once we are ready (July 10), we will change this to invite you to AUG</p>
  <button class="disabled" id='closed' onclick="closeInvite()"> Join Aussie Games today!"</button>
</div>

相关问题