在 html 上切换我的问题 - toggleMe Issue on html

toggleMe Issue on html

本文关键字：我的问题 html | 更新日期: 2023-09-27

我需要一些关于切换我的帮助，，单击按钮两个后，另一个打开隐藏不一一打开,,, *对不起，我的英语不好*

我的 JS

<script type="text/javascript">
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block"
} else {
e.style.display="none"
}
return true;
}
</script>

我的网页

<div>
<input class="styled-button-2" onclick="toggleMe('1')" type="button" value="Text 1" />
<input class="styled-button-2" onclick="toggleMe('2')" type="button" value="Text 2" />
<input class="styled-button-2" onclick="toggleMe('3')" type="button" value="Text 3" />
<input class="styled-button-2" onclick="toggleMe('4')" type="button" value="Text 4" />
</div>
<div id="1" style="display: block;">
111111111111
</div>
<div id="2" style="display: none;">
22222222222222
</div>
<div id="3" style="display: none;">
3333333333333
</div>
<div id="4" style="display: none;">
444444444444
</div>

我听不懂，对不起...这就是你想要的吗？http://jsfiddle.net/030faz4L/

Javascript：

var actual_div = 1;
function toggleMe(a){
    // hide the other div
    document.getElementById('div_'+actual_div).style.display = 'none';
    var e=document.getElementById('div_'+a);
    if(!e) return false;
    if(e.style.display=="none"){
        e.style.display="block"
    } else {
        e.style.display="none"
    }
    actual_div = a;
    return true;
}

.HTML：

<div>
<input class="styled-button-2" onclick="toggleMe('1')" type="button" value="Text 1" />
<input class="styled-button-2" onclick="toggleMe('2')" type="button" value="Text 2" />
<input class="styled-button-2" onclick="toggleMe('3')" type="button" value="Text 3" />
<input class="styled-button-2" onclick="toggleMe('4')" type="button" value="Text 4" />
</div>
<div id="div_1"  style="display: block;">
111111111111
</div>
<div id="div_2" style="display: none;">
22222222222222
</div>
<div id="div_3" style="display: none;">
3333333333333
</div>
<div id="div_4" style="display: none;">
444444444444
</div>