我有一个表“看到更多”写在标题侧“见习保险。”如何在点击按钮/文本时显示信息？
我希望人们能够点击查看更多然后出现在标题下的信息
如何我要这样做吗？
谢谢！
詹姆斯
<table height="20" width="775" cellpadding="0" cellspacing="0">
<tr>
<td>
<font face="lucidagrande" size="4" color="black">Trainee Insurance Broker - London</font>
<td align="right">
<font face="lucidagrande" size="2" color="red">See More...</font>
</td>
</tr>
</table>
可能有其他的方法 - 非JavaScript的方式 - 但我一直使用JavaScript来做到这一点。一个onclick处理程序添加到“see more” TD，并在此处理程序中，设置more元素有display:inline风格，像这样（未经）：
<script type="text/javascript">
function show_more (element_to_show) {
var element_to_show = getRefToDiv(element_to_show);
element_to_show.style.display = "inline";
}
</script>
<table height="20" width="775" cellpadding="0" cellspacing="0">
<tr>
<td>
<font face="lucidagrande" size="4" color="black">Trainee Insurance Broker - London</font>
<td align="right" onclick="show_more('more');">
<font face="lucidagrande" size="2" color="red">See More...</font>
</td>
<td id="more" style="display:none;">The guy will see this when he clicks See More...</td>,
</tr>
</table>
你好！非常感谢您的帮助！ – James
我输入了代码，但看到更多不是可点击的，我应该添加什么？ – James
@James - 对不起。首先，确保浏览器中启用了JavaScript。另外，将
我会使用jQuery显示/隐藏文本时的块“查看更多......”被点击。
当然，这里假设你已经熟悉使用jQuery。如果您不是，或者您不能/不会使用它，Google搜索就会快速启动http://www.cssnewbie.com/showhide-content-css-javascript/
使用display = none;并在onclick事件中删除它。
您将需要;点击“查看更多”时会显示隐藏的DIV。这将需要成为Javascript或JQuery。或者让一些PHP在表中生成另一行。
如果你想从一个单独的文件加载数据，你将不得不使用AJAX。如果您想在点击“See More”时显示网页上已有的元素，则可以使用常规javascript。只需在表中添加一个新行，给它一个ID并使用内联样式隐藏它。然后在“see more”文本周围添加一个链接，并为其提供一个显示隐藏行的onclick处理程序。像这样：
<table height="20" width="775" cellpadding="0" cellspacing="0">
<tr>
<td><font face="lucidagrande" size="4" color="black">Trainee Insurance Broker - London</font></td>
<td align="right"><font face="lucidagrande" size="2" color="red"><a href="#" onclick="document.getElementById('showme').style.display = 'table-row'; return false;">See More...</a></font></td>
</tr>
<tr id="showme" style="display: none">
<td colspan="2">More info appears here!!!</td>
</tr>
</table>
你有一个20世纪90年代HTML的糟糕情况。
这里是上世纪90年代的方式来做到这一点：
<div>Trainee Insurance Broker - London</div>
<div id="a1" style="display:none">### more information ###</div>
<a href="javascript://" onclick="showThis('a1')">See More...</a>
JS：
function showThis(id) {
document.getElementById(id).style.display='block'
}
一些提示：
使用jQuery：
给ID来你的 '查看更多' 按钮，这是要显示的内容：
$('#see_more').click(function() { $('#more_content').show(); });
<script language="javascript">
$(document).ready(function(){
$('#see_more').click(function(){
$("#more_text").show();
});
$("#more_text").hide();
});
</script>
<table height="20" width="775" cellpadding="0" cellspacing="0">
<tr>
<td>
<font face="lucidagrande" size="4" color="black">Trainee Insurance Broker - London</font>
<td align="right" id="see_more">
<font face="lucidagrande" size="2" color="red">See More...</font>
</td>
</tr>
<tr><td id="more_text">This is more text here......</td></tr>
</table>
正如你已经发现，有许多方法来实现这个。如果您对最现代的技术感兴趣，您可能需要对DOM（文档对象模型）的工作方式进行很好的处理，并检出名为jQuery（http://jquery.com/）的JavaScript库。即使有关这些技术的基本知识，您也可以使用非常少的代码来完成真棒。 –
将您的HTML更新为21世纪的标准将有助于您的HTML开发体验。 'font'标签已被弃用，HTML中的'color'，'face'和'align'属性也一并使用。表格布局通常也被忽视。我强烈建议选择Dan Cederholm的* Bulletproof Web Design *。 – Shauna