javascript - 如何通过html将参数传递给函数并通过javascript访问？

Question

下面是我的 HTML 代码，用于在两个选项卡之间切换并相应地显示内容

       <div class="tab"  id="tab-1" onclick="switch_tab(1)">
            <a class="tab-text"  href="">ABC</a>
        </div>
        <div class="tab" id="tab-2" onclick="switch_tab(2)">
            <a class="tab-text" href="">XYZ</a>
        </div>
        <div id="content">
          <div id="content-abc"> ... </div>
          <div id="content-xyz"> ... </div>
        </div>

JavaScript:

        function switch_tab(index) {    
         switch(index) {
          case 1:
              hide_content("content-xyz");
              show_content("content-abc");
              break;
          case 2:
              hide_content("content-abc");
              show_content("content-xyz");
              break;
         }
        }

        function show_content(idname) {
         document.getElementById(idname).style.display = "block";
        }

        function hide_content(idname) {
         document.getElementById(idname).style.display = "none";
        }

但它不起作用。帮助。

Answer 1

我认为问题出在 <a>带有空白的标签 href值(value)。将它们更改为“#”(当然还添加“content”div)可以解决问题。如果样式不需要 anchor ，您也可以去掉 anchor ，因为点击事件是在包装 div 上处理的。

http://jsfiddle.net/9p2TM/