提交按钮第一次未触发事件

Question

我正在尝试捕获提交按钮单击事件，并将页面滚动到顶部(如果还没有(。

由于某些原因，该事件不会第一次触发，即如果滚动大于0，则不会滑动到页面顶部。它只会第二次激活。

var buttonSearch = function () {
jQuery(document).ready(function () {
$("#DashboardSearchButton").submit(function () {
if (window.scrollY != 0) {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
});
});
};
<input id="DashboardSearchButton" type="submit" value="Search" onsubmit="buttonSearch();" />

有什么想法或建议吗？我是不是错过了什么？非常感谢。

Answer 1

这样试试：

jQuery(document).ready(function () {
$("#DashboardSearchButton").submit(function () {
if (window.scrollY != 0) {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
});
});
<input id="DashboardSearchButton" type="submit" value="Search" />

您可以从元素的onclick/onsubmit属性调用函数，也可以创建eventListener来监视事件，而不是两者都调用。

jQuery的事件监听器被创建"；在引擎盖下"；，可以这样说：

$("#DashboardSearchButton").submit(function () { //stuff });

你从来没有见过.addEventListener("submit", myFuncName)的措辞——jQuery为你做这件事。

它第一次不起作用的原因是您创建了两个事件侦听器。第一个由#DashboardSearchButton输入上的onsubmit=属性触发，只创建了第二个事件侦听器(jQuery.submit()处理程序(。创建第二个eventListener后，it现在也侦听提交，第二次一切正常。但是，每次单击提交按钮，都会创建另一个jQuery事件处理程序。