我可以将数据打开更改为数据关闭吗？答案

【问题标题】：Can I change data-open to data-close?我可以将数据打开更改为数据关闭吗？
【发布时间】：2018-08-20 20:08:57
【问题描述】：

美好的一天！我是 Foundation 6 的新手，我有一个按钮可以切换到我的画布外视图。

<button class="hamburger-btn" type="button" data-open="mobile-nav">

我想要发生的是，当有人点击它时，画布外进入视图，数据打开变成数据关闭，所以当它再次点击时它可以隐藏画布外。

所以就像下面这样。

<button class="hamburger-btn" type="button" data-close>

这可能吗？

【问题讨论】：

下次请使用zurb-foundation标签。 foundation 标签与 ZURB Foundation 无关，用于 Apple 框架。
谢谢，抱歉，这是我第一次提问

标签： jquery html frameworks zurb-foundation zurb-foundation-6

【解决方案1】：

您可以使用以下代码：

$('.hamburger-btn').click(function() {
  if ($(this).attr('data-open')) {
    $(this).removeAttr('data-open');
    $(this).attr('data-close', "");
  } else {
    $(this).removeAttr('data-close');
    $(this).attr('data-open', "mobile-nav");
  }
})

演示

$('.hamburger-btn').click(function() {
  if ($(this).attr('data-open')) {
    $(this).removeAttr('data-open');
    $(this).attr('data-close', "");
  } else {
    $(this).removeAttr('data-close');
    $(this).attr('data-open', "mobile-nav");
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="hamburger-btn" type="button" data-open="mobile-nav"></button>

【讨论】：

一般来说，如果这是他需要的，也有使用open和close方法的函数：foundation.zurb.com/sites/docs/off-canvas.html#open

【解决方案2】：

无需在数据打开和数据关闭之间切换，数据切换来救援！

<button class="hamburger-btn" type="button" data-toggle="mobile-nav">

如果导航关闭，上面将打开导航，如果导航打开，则将其关闭。

【讨论】：