Bootstrap模态形式开关-一键式功能

Question

因此，在发布此问题之前，我已经查看了stackoverflow，但没有找到一个可靠的答案，因此我将其发布。 我没有问如何使用引导程序来切换表单，因为我已经在此处完成了操作-http: //cdpn.io/luotA

我的问题是如何将jquery选择器简化为一个功能。 为此，我要做的就是为每个按钮分别调用每次单击以进行切换。 请查看笔http://cdpn.io/luotA-单击左下角的编辑笔进行分叉并进行更改

我想要的是一个简单的单击功能即可完成相同的操作。 任何建议和/或答案将是巨大的。 您可以使用分叉式笔写回URL，以获取工作示例。

提前致谢。

这是代码：

              $("#join-trigger").click(function(){
               $('#modal-login').modal('hide');
               $('#modal-join').modal('show');
              });

              $("#forgot-trigger").click(function(){
                $('#modal-login').modal('hide');
                $('#modal-forgot').modal('show');
              });

              $("#login-trigger").click(function(){
                $('#modal-join').modal('hide');
                $('#modal-login').modal('show');
              });

              $("#back-login").click(function(){
                $('#modal-forgot').modal('hide');
                $('#modal-login').modal('show');
              });

              $("#back-join").click(function(){
                $('#modal-forgot').modal('hide');
                $('#modal-join').modal('show');
              });

Answer 1

我写的一个简短的东西：

$("#join-trigger, #forgot-trigger, #login-trigger, #back-login, #back-join").click(function(){
  var hash = {
    'join-trigger': ['modal-login', 'modal-join'],
    'forgot-trigger': ['modal-login', 'modal-forgot'],
    'login-trigger': ['modal-join', 'modal-login'],
    'back-login': ['modal-forgot', 'modal-login'],
    'back-join': ['modal-forgot', 'modal-join']
  };

  $('#' + hash[$(this).attr('id')][0]).modal('hide');
  $('#' + hash[$(this).attr('id')][1]).modal('show');
});

http://codepen.io/anon/pen/kECDA