javascript - 如何创建按钮事件在没有页面加载的情况下发生？

Question

我正在开发一个 ASP.NET 应用程序，其中的按钮编写如下:-

<button onclick='javascript:imagech(this);' class='close_product color_dark tr_hover'><i class='fa fa-times'></i></button>

我还有一个用于上述按钮的客户端 JavaScript 函数:

<script type="text/javascript">
  function imagech() {
    alert('image clicked.');
  }
</script>

我想要的是，每当我单击该功能时，按钮单击事件不应触发页面加载。上面的对象不是服务器控件，但它的事件发生页面加载。我还可以使用另一个 html 控件，如下所示:

<input type='button' onclick='javascript:cartclicked(this);' value='X' class='close_product color_dark tr_hover' />

这不会发生页面加载，但我希望图标也用作:

<i class='fa fa-times'></i>

里面<button>标签。但是<i> <input> 中未使用标签标签。我怎样才能<button>没有任何页面加载的标记事件？请在这里帮助我。

Answer 1

您似乎正在使用 <button>里面 <form>元素。默认情况下，按钮充当提交按钮，并且它尝试在点击时提交表单。

为了继续使用按钮并避免此问题，您需要将类型指定为按钮，如下所示

<button type="button" onclick='javascript:imagech(this);' class='close_product color_dark tr_hover'><i class='fa fa-times'></i></button>