让我的按钮类型=“提交”打开另一只手风琴

Question

在我的使用Bootstrap3的网站上，我的页面上有3个手风琴。 所有的手风琴都有字段和按钮，每个都有自己的过程。

我遇到的问题是，当我从手风琴1单击我的<button type="submit"> ，我希望它打开手风琴2。 该按钮必须在我后面的代码中触发，以便它在打开手风琴2之前终止在手风琴1中完成的过程。显然，我不能使用<button type="button">因为这不会在后面的代码中触发，因此我将样式设置为<a>但后来意识到我无法在后面的代码中触发它。

我得到的一种解决方案是在按钮上添加href ，尽管这不被支持，因为它删除了我的手风琴中的所有内容，因此我还可以通过什么其他方法指示我的按钮在代码中触发以结束过程，然后打开手风琴2。

也许需要用JavaScript / jQuery或直接用HTML来完成，我不知道。 我更喜欢HTML，但是我愿意接受所有建议。

我用Google搜索它，我知道对于button type="button" ，以下属性是必需的data-toggle="collapse" data-parent="NameOfMyParent"

Answer 1

是的，您必须使用javascript（因为您已经在手风琴上使用过javascript）。 我假设您使用的是jquery（因为您使用的是Bootstrap）。 因此，一种解决方案是绑定一个事件以防止提交（在表单提交或单击按钮时），然后使用$.ajax()提交表单$.ajax()如果您的表单包含某些上载过程，这可能很复杂）。

$("#your_form_id").on("submit", function(e){
  e.preventDefault();
  var url = $(this).action;
  var data = {};
  /* get your form datas here */
  $.ajax({
    url:url,
    data:data,
    /* use any of theses callback, or none 
     *if you don't care about the request is correct or not
     */
    success:function(res){},
    error:function(res){},
    complete:function(res){
       // call your second accordion here
    }
  })
});

或者，您可以使用<input type="button">并执行相反的工作：将事件绑定到该事件以触发Submit，或者仅启动手风琴，或执行任何操作。

Answer 2

固定。 我要做的就是向panel-body添加一个id ，然后使用data-target在我的按钮中引用它