javascript显示/隐藏按钮

嗨我有几个按钮，第一个是显示/隐藏，它在第一次点击时正常工作。第二个是下一个表，当下一个表被点击时，它应该隐藏表1并且只显示表2.然后，如果隐藏按钮被点击，它应该隐藏table1和table2，而当前表2仍然显示隐藏按钮是什么时候点击。这里是我的问题和代码的例子：http://jsfiddle.net/zfnx6/27/javascript显示/隐藏按钮

来源

2012-06-09 user1301737

如果你确实使用jQuery，你可能想使用它。这将有助于清理你的代码。 – pimvdb

你可以用更简洁的方式写jquery的代码。 – undefined

我更新了你的代码，就像你描述的一样，最大的改变是将外部表定义为table1和table2的容器。这样，单击顶部按钮（显示/隐藏）可以同时影响两个表，而不必混淆两个表的if语句。

有些参数随HTML中的按钮而改变，第二个按钮成为两个表的切换。如果你将使用两个以上的表格，目前的方法不会太有效。

演示http://jsfiddle.net/zfnx6/41/

来源

2012-06-09 19:09:37

感谢它很好用 – user1301737

我需要做些什么来添加后台和下一个按钮，以隐藏关联的表？所以如果我想在显示table1时禁用后退按钮，并在显示table2时禁用下一个按钮？ – user1301737

我真的不明白。只有一个按钮“nextbt2”，其标签/值在“后退”和“下一次”之间切换。如果您添加了新按钮，则可以像使用表格一样使用样式可见性和显示。 –

看看jquery ui accordian。

如果你想一次只显示一个表格，你可以考虑使用它。

在你的小提琴中，你没有使用jQuery。在jquery中显示和隐藏元素非常简单，并且相当多地减少了代码。

来源

2012-06-09 19:04:22 nunespascal

如果你有意使用jQuery，它会清理你的代码很多。这里有一个例子：http://jsfiddle.net/zfnx6/43/

来源

2012-06-09 19:15:11 Trevor

我自己的变化：http://jsfiddle.net/zb9Tt/

我做了几个改变你的HTML，但主要是这是关于JavaScript的。以下是一些相当轻量级的jQuery，它可以为页面上无限量的toggleable对象提供所需的功能。 active类用于显示当前选定的“选项卡”。

(function ($) { 

    $(document).ready(function() { 
     $("#togglebutton").bind("click", function() { 
      $(".active, #nextbt").toggle(); 
     }); 

     $("#nextbt").bind("click", function() { 
      var current = $(".active"); 
      var next = $(".active + .toggleable"); 

      if (next.length) { 
       current.removeClass("active").hide(); 
       next.addClass("active").show(); 
      } 
     });  
    });  
})(jQuery);

来源

2012-06-09 19:57:16 jatrim

$(document).ready(function(){ 
    $("#hide").click(function(){ //#hide use your element id 
     $("p").hide();   // use your element to hide 
    }); 
    $("#show").click(function(){ //#show use your element id 
     $("p").show();    // use your element to show 
    });  
});

这仅仅是基本途径

来源

2015-07-11 10:55:56 Jayram

这是管理这个的基本方法。 – Jayram

javascript显示/隐藏按钮

回答

相关问题