Javascript在页面加载时触发onclick

Javascript onclick firing when the page loads

本文关键字:onclick 加载 Javascript      更新时间:2023-09-26

我使用Javascript运行函数有问题。我想要的是,当用户单击按钮时,函数就会启动。但是,它会在页面加载时触发。

完整代码如下:

 <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"> 
<!-- Latest compiled and minified CSS -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  </head>
 <body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2"></div>
            <div class="col-md-8">
                 <input type="submit" id="btn" value="Load">
                <div id="description">
     
         
          <div id="info">
            <h1 id="title"></h1>
            <p id="description"></p>
            <ul id="list"></ul>
          </div>
        </div>
                
                
            </div>
        <div class="col-md-2"></div>
    </div>
</div>

<script>
  var btn = document.getElementById('btn');
  var title = document.getElementById('title');
  var description = document.getElementById('description');
  var list = document.getElementById('list');

  btn.onclick = load();
  function load() {
    alert("Working.");
  }


</script>

  <!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

现在,它显然没有做什么,除了发出一个警告框。但是稍后我将使用它通过XMLHttpRequest对象加载一个文件。但是现在,它没有按它应该的方式工作。

我还应该指出,代码与匿名函数一起工作得很好,但整个想法是有一个正常的函数。我只是不确定为什么它会工作与一个匿名函数,而不是一个正常的。

应该是

var btn = document.getElementById('btn');
var title = document.getElementById('title');
var description = document.getElementById('description');
var list = document.getElementById('list');
btn.onclick = load;
function load() {
  alert("Working.");
}