jQuery单击事件未在表单内的按钮上触发 [英] jQuery click event not triggered on button inside form

问题描述

我在这样的表单中有一个按钮:

I have a button inside a form like this:

<form>
   <input type="text" />
   <input type="password" />
   <button type="button" class="btn-login">Log in</button>
 </form>

我正在尝试通过在js中执行此操作来触发按钮的点击事件:

I am trying to trigger the button's click event by doing this in the js:

$(document).ready(function () {
     $('.btn-login').live("click", function () {
          alert("Button clicked!");
      });
});

但是由于某种原因，这是行不通的.

But for some reason, this is not working.

如果我删除文本框和按钮周围的<form></form>，则会触发click事件，但这也意味着我的页面无法正确显示，因此我想知道是否有一种方法可以触发按钮的click事件在表单中时.

If I remove the <form></form> that is around the textboxes and button, the click event is triggered, but this also means that my page is not showing properly, so I wonder if there is a way to trigger the button's click event when inside the form.

推荐答案

如果您正在使用最新版本的Jquery，请尝试使用on而不是live，因为1.9版已弃用它.如果您使用的是1.7版，则您的代码将可用.

If you are using latest version of Jquery the try on instead of live as it is deprecated in version 1.9. If you are using version 1.7 then your code will work.

$(document).ready(function () {
     $('.btn-login').on("click", function () {
          alert("Button clicked!");
      });
});

JS Fiddle .on()示例

JS Fiddle .live()示例

这篇关于jQuery单击事件未在表单内的按钮上触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！