Question

我正在尝试通过css类订阅事件。我有两个处理程序，定义如下：

$(document).ready(function() {
    $('.refresh-cart').click(
        function(e) {
            alert('refreshing');
        });

    $('form.ajax').submit(
        function(e) {
            e.preventDefault();
            $.post(
                this.action,
                $(this).serialize(),
                function(data, textStatus, jqXHR) { alert('post'); },
                'text');
        }
    );
});

当这些处理程序重叠时，我无法获得预期的功能。

此代码可以通过警告“发布”并提交ajax请求来正常工作。

 <form action="page.html" method="post" class="ajax">
     <input type="text" name="Sample" value="SampleValue" />
     <input type="submit" />
 </form>

此代码通过提醒“刷新”

正常工作

  <div class="refresh-cart">Refresh Widget</div>

但是，当这些重叠时（例如以下示例中），只会触发'refresh-cart'用户。

 <form action="page.html" method="post" class="ajax">
     <input type="text" name="Sample" value="SampleValue" />
     <input type="submit" class="refresh-cart" />
 </form>

我做错了什么，如何让两个处理程序都解雇？

Answer 1

它对我来说很好..

然而，您必须关闭第一个警告框，然后才能显示第二个警告框。

您的代码位于http://jsfiddle.net/gaby/W3zC4/

Answer 2

您是否尝试过点击处理程序提交表单？

$(document).ready(function() {
    $('form.ajax').submit(
        function(e) {
            e.preventDefault();
            $.post(
                this.action,
                $(this).serialize(),
                function(data, textStatus, jqXHR) { alert('post'); },
                'text'
            );
    });

    $('.refresh-cart').click(
        function(e) {
            alert('refreshing');
            $('form.ajax').submit();
            return false;
     });
});

Answer 3

它对我也很好。我认为您还应该考虑使用jquery表单插件here进行ajax提交并将输入类型从提交更改为按钮

使用jQuery为DOM事件订阅多个处理程序

3 个答案: