我正在编写一个php页面,当鼠标悬停在链接上时,会有更多链接和一些信息下拉。事情是,我不知道该怎么做。
我已经输入了一些javascript,我可以获得我想要删除的div的id。但是,设置可见性不起作用,因为只是使该块显示或消失。我需要添加和删除块吗?我希望如果解决方案不需要重新加载页面,而css充其量只是最后的手段。
<script type="text/javascript">
function showElement(id){
document.getElementById(id).style.visibility = "visible";
}
function hideElement(id){
document.getElementById(id).style.visibility = "hidden";
}
</script>
对于那些建议我使用jquery的人,这是我的尝试,基于你给我的一些和一些谷歌搜索:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('a#').each( function(){
var $id = $(this).attr('id');
$('a#'+$id).hover(function(){
$('div#'+$id).toggle();
});
});
});
</script>
它不起作用。不可否认,这并不奇怪,因为我从未在昨天之前看过jquery。不过,我不知道它有什么问题(可能还有很多东西)。它试图做的是遍历所有链接,然后当盘旋时,应显示具有相同名称的div。或者那就是理论。
答案 0 :(得分:2)
请考虑使用像jquery这样的javascript库来操作dom元素。以下是hover
函数的一个非常基本的示例。
查看jquery documentation了解其他用法示例。
答案 1 :(得分:1)
您的javascript代码中存在拼写错误。您使用了getElemtneById
,但它应该是getElementById
。
使用style.visibility = "visible";
来制作必须为visiblity:hidden
css属性的可见div或span。那么这只会有效。如果有display:none
,那么您可以使用下面给出的javascript。
<script type="text/javascript">
function showElement(id){
document.getElementById(id).style.display = "block";
}
function hideElement(id){
document.getElementById(id).style.display = "none";
}
</script>
我希望它会对你有所帮助, 感谢