javascript - 单击按钮更改选项卡

Question

目前，我正在使用以下链接中的指南来确定如何构建选项卡 (http://www.w3schools.com/howto/howto_js_tabs.asp)。

     function openTab(evt, tabName) {
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(tabName).style.display = "block";
        evt.currentTarget.className += " active";
     }

     // Get the element with id="defaultOpen" and click on it
     document.getElementById("defaultOpen").click();

我想更改按下按钮时显示的选项卡。因此，在javascript中的eventListener代码中:

     document.getElementById("btn_click").addEventListener("click", function() {
             openTab("click", "tab2");
     }

这给了我“点击”，因为 evt 是未定义的。希望在如何定义参数 evt 以在按下按钮时更改选项卡方面提供任何帮助(最好使用 javascript soln)。

Answer 1

您需要像这样传递实际的点击事件:

document.getElementById("btn_click").addEventListener("click", function(e){
    openTab(e, "tab2");
})

还有一条一般规则:尽量避免 w3schools 成为瘟疫。整体质量很低。更好的办法是只在 stackoverflow 上搜索特定问题的解决方案，然后使用 mozilla引用所有与 DOM 相关的东西。