像这样绑定onclick事件有什么问题？

Question

像这样绑定onclick事件有什么问题？不知何故，函数永远不会被触发。

我认为更详细的代码会更好地解释这个问题，我使用es6模板来生成上面的代码：

let tmp = ` <div id="pageAppointment">
        ${this.renderDates(this.data.dateOptions)}
        ${this.renderTimes(this.timeOptions)}
        ${this.data.tip ? `<div class="tip flex align-center">${this.data.tip}</div>` : ``}
        <div class="btn-wrap mui-flex">
            <div class="ok-btn cell" onclick="${this.onOK}">OK</div>
        </div>
    </div>`
$(this.root).html(tmp);

Answer 1

因为onclick="function name();"创建了一个函数，所以它不会调用它。你可以做 而是onclick="alert(111);"。

<button onclick="alert(111);"> click </button>

或者调用.js文件中的函数，如：

function onOK(){
  alert(111);
}

<button onclick="onOK();">click</button>

这真的很糟糕，但作为一个例子，你可以这样做：

 <button onclick="function onOK(){
                    alert(111);
                   }; onOK();" >click</button>

创建函数THEN调用它。这是一个例子，不要这样做，但现在你了解它是如何工作的

Answer 2

你的处理程序只定义了一个函数onOK，但是你从不调用它，为什么要调用它？如果你想要它被执行，把它变成像这样的IIFE

(function onOK() { ...})()

Answer 3

正确的方法是：

<div onclick="alert(111);">ok</div>

Answer 4

在脚本文件上使用onclick函数，然后附加到元素上。

<div onclick="someFunc()">ok</div>

脚本文件：

function someFunc(){

     ...

}

Answer 5

最后调用您的函数function name();

<button onclick = "function clck(){alert('hi');}clck();">
Click
</button>

Answer 6

应该是这样的

＆＃13;

＆＃13;

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

＆＃13;

<div onclick="myFunction()">Button Div</div>

＆＃13;

＆＃13;

＆＃13;