Question

我有以下按钮

<a class="btn-email" data-parent="#booking" data-target="#body-four" href="#body-four" aria-expanded="false" aria-controls="body-four">Call Back</a>

当用户单击该按钮时，它会调用以下jQuery函数

$("a.btn-email").click( function() {
    var result = false;
    if (!$("a.btn-email").hasClass('opening')) {
        if ($("#body-four").hasClass('collapse') && !$("#body-four").hasClass('in')) {
           var result = true;

            $.ajax({
               type: "POST",
               async: true,
               url: "validate.php",
               data: $("#bookingForm").serialize(),
               success: function(data) {
                   var message = $.parseJSON(data);
                   if(message['status']=='failed') {
                     ....
                   } else {
                    $("a.btn-email").attr("data-toggle", "collapse");
                    $("a.btn-email").addClass('opening');
                    $("a.btn-email").trigger('click');
                  }
               }
            })
            $("#dlgError").dialog("destroy");
        }
    } else {
        $("a.btn-email").removeClass('opening');
        $("a.btn-email").removeAttr('data-toggle');
    }
});

如果ajax验证成功，那么该函数会将data-toggle属性添加到按钮，然后模拟单击以便数据切换将打开bootstrap手风琴，但是triggle（'click'）不会激活数据切换，我必须再次手动点击按钮才能使其工作。

Answer 1

将您的逻辑移动到JQuery调用的单独函数中。所以你可以打电话给他们，而不是触发一个事件。

Answer 2

您可以在else部分执行此操作：

....

else {
       $("a.btn-email").attr("data-toggle", "collapse");
       $("a.btn-email").addClass('opening'); 
       var href = $("a.btn-email").attr("href");// get the href   
       $(href).collapse("toggle");
     }

.....

触发单击不激活数据切换

2 个答案: