如何在onclick属性中编写jQuery代码或调用jQuery函数

Question

为什么这个简单的代码不起作用？

<div onClick="myFunction()"></div>

$(document).ready(function(){
    function myFunction(){
       alert("sss");
    }
})

JS文件是外部文件，在我的HTML页面的head中调用。之前添加了jQuery库。

Answer 1

它不起作用，因为on*事件属性调用的函数需要在window的范围内。您的代码将函数放在jQuery document.ready处理程序中。试试这个：

＆＃13;

＆＃13;

function myFunction() {
  alert("sss");
}

＆＃13;

<div onClick="myFunction()">Click me</div>

＆＃13;

＆＃13;

＆＃13;

您应该注意，由于这个原因，使用on*事件属性被认为是过时的。您应该使用不显眼的JS代码来附加您的事件处理程序，无论是在本机JS中：

＆＃13;

＆＃13;

document.querySelector('div').addEventListener('click', function() {
  alert("sss");
});

＆＃13;

<div>Click me</div>

＆＃13;

＆＃13;

＆＃13;

或jQuery，因为你似乎已经在使用它了：

＆＃13;

＆＃13;

$(function() {
  $('div').on('click', function() {
    alert("sss");
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Click me</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

首先在一些教程网站上阅读和阅读html和Jquery的教程，例如This或thisone。

并回答您的代码

HTML

<button onclick="myFunction()">Click me</button>

的Javascript

function myFunction() {
    alert('Hello');
} 

假设你包含了JQuery库。