Question

对不起，这太长了，我试着压缩它。

我正在使用jquery循环遍历几个元素，并为每个父元素添加单击触发器。单击父级时，子元素将变为可见并移动到父级外部。

通过这种方式，我创建了一个底部固定工具栏，其中父项是一个按钮，子项是单击按钮时显示或隐藏的面板。一切都很好，除了我无法弄清楚如何做到这一点，当用户点击显示的面板外面时，面板会切换掉。

以下是一些示例标记：

<div class="dashbar">
   <div class="dash-button">
      Button One

      <div class="dash-panel">
          This is the panel that is toggled when button one is clicked
      </div>
    </div>

    <!-- Any number of other buttons -->
</div>

同样，当点击任何短划线按钮时，它会将子仪表板移动到其父级之外，并使其可见（以及其他一些样式技巧）。

我有几种类型的面板（菜单，模态，面板等）都存储在一个对象中。我用来遍历元素并添加点击触发器的jQuery是：

$.each(['panel', 'menu', 'etc'], function (index, value) {
    // Select all the elements that match this panel type
    var panelClass = '.dash-' + value;
    var $panels = $(panelClass);

    // Now cycle through those elements
    $panels.each(function () {

        // Select the panel to be displayed and its parent
        var $panel = $(this);
        var $parent = $panel.parent();

        // Add the click event to the parent
        $parent.click(function () {
            // Toggle the panel with dashbar.panels.toggle($panel) elsewhere in my object
        });
    });
});

所有这一切都很有效。我试过添加：

$( "body").one('click', function() {
     // conceal the panel with dashbar.panels.conceal($panel);
});

$parent.click(function(e) {
     e.stopPropagation();
});

$panel.click(function(e) {
     e.stopPropagation();
});

在$ parent.click（）之外，但随后该事件运行次数荒谬而且有问题。

我真正想要的是在单击父级时添加事件，并在隐藏菜单后将其删除。但是，当我添加上面的INSIDE $ parent.click（）时，我必须在第一次点击父级两次才能显示面板。我只能假设body.click（）动作第一次生效并隐藏面板。

我很难过，很想知道任何会得到我想要的结果的东西。很高兴重写我的代码。

谢谢！

从另一个element.click（）内部添加body.click（）触发器一次

0 个答案: