如何在< a>的点击时切换(隐藏/显示)表格用Javascript标记 [英] How to toggle (hide/show) a table onClick of <a> tag in Javascript
本文介绍了如何在< a>的点击时切换(隐藏/显示)表格用Javascript标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想显示和隐藏(切换)< a>
的< table>
onClick
事件.这是我的< a>
标记
I want to show and hide (toggle) the <table>
onClick
event of the <a>
.
this is my <a>
tag
<a id="loginLink" onclick="toggleTable(true);" href="#">Login</a>
这是我的Javascript函数 toggleTable(hide)
:
Here is my Javascript function toggleTable(hide)
:
<script>
function toggleTable(hide)
{
if (hide) {
document.getElementById("loginTable").style.display="table";
document.getElementById("loginLink").onclick = toggleTable(false);
} else {
document.getElementById("loginTable").style.display="none";
document.getElementById("loginLink").onclick = toggleTable(true);
}
}
</script>
这是我的< table>
标记:
<table id="loginTable" border="1" align="center" style="display:none">
我第一次单击< a>链接
它显示了我的表格,但是下次单击时却没有隐藏.我在做什么错了?
The first time when I click the <a> link
it shows my table, but not hiding back when I click it next time. What am I doing wrong?
推荐答案
您正试图在同一函数调用中更改 onclick
的行为.像这样尝试:
You are trying to alter the behaviour of onclick
inside the same function call. Try it like this:
<a id="loginLink" onclick="toggleTable();" href="#">Login</a>
JavaScript
function toggleTable() {
var lTable = document.getElementById("loginTable");
lTable.style.display = (lTable.style.display == "table") ? "none" : "table";
}
这篇关于如何在< a>的点击时切换(隐藏/显示)表格用Javascript标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文