87,990
社区成员
发帖
与我相关
我的任务
分享一段js 的switch语句，在IE中就运行不好，chrome很顺利，为啥子？
页头有个导航栏，5个<li><a ...>...</a></li> 标签，我是想当鼠标移到某个上面的时候，能读取它的href链接。
这样就可以根据链接来选择旁边的文字说明。我想你懂得
IE中只对第一个case语句有效果，其它的移上面去都米反应。chrome就很顺畅
这样就可以根据链接来选择旁边的文字说明。我想你懂得
IE中只对第一个case语句有效果，其它的移上面去都米反应。chrome就很顺畅
$("ul>a").mouseover(
function() {
$("#headSpan").css("color","#FFE87C");
var headspan = document.getElementById("headSpan");
var murl = $(this).attr("href");
switch(murl)
{
case "http://joaner.com/":
headspan.innerHTML='<span>Go to home</span>';
break;
case "http://joaner.com/post.php":
headspan.innerHTML='<span>There are a few articles and fine food</span>';
break;
case "http://joaner.com/picture.php":
headspan.innerHTML='<span>Maybe you will eat the display</span>';
break;
case "http://t.qq.com/Vague-smile":
headspan.innerHTML='<span>I say</span>';
break;
case "http://joaner.com/about.php":
headspan.innerHTML='<span>What's I doing</span>';
break;
case "http://joaner.com/other.php":
headspan.innerHTML='<span>Mmm,little things</span>';
}
});
...全文
请发表友善的回复…
发表回复
改一下昵称 2011-07-03
- 打赏
- 举报
对我来说都一样，嘿嘿
乌镇程序员 2011-07-03
- 打赏
- 举报
$("ul a")会选中ul下所有的a子元素，children('a')方法只选择父元素下第一级的a子元素。
改一下昵称 2011-07-03
- 打赏
- 举报
这样好了，ul a 这在JQuery选择器教程好像还没见过。
哈哈谢谢你了，这下问题解决，因为这个问题折腾了两天时间
哈哈谢谢你了，这下问题解决，因为这个问题折腾了两天时间
乌镇程序员 2011-07-03
- 打赏
- 举报
改用.children()方法可以解决，parent > child选择器的兼容性可能有点问题。
$("ul").children("a").mouseover( function() {..});乌镇程序员 2011-07-03
- 打赏
- 举报
选择器改为$("ul a")是正常的，但这样估计就不符合你的需求了。
改一下昵称 2011-07-03
- 打赏
- 举报
啊，我的是披着IE8的IE7啊，怪不得还只是单窗口模式
改一下昵称 2011-07-03
- 打赏
- 举报
我的也是IE8，只有在鼠标移到第一个<li>标签上才旁边的headSpan才会改变，剩下的4个就一直没反应
乌镇程序员 2011-07-03
- 打赏
- 举报
IE7模式访问确实出现楼主说的情况！
乌镇程序员 2011-07-03
- 打赏
- 举报
下面代码在本地使用IE8访问也正常。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$("ul>a").mouseover(
function() {
$("#headSpan").css("color","#FFE87C");
var headspan = document.getElementById("headSpan");
var murl = $(this).attr("href");
switch(murl)
{
case "http://joaner.com/":
headspan.innerHTML='<span>Go to home</span>';
break;
case "http://joaner.com/post.php":
headspan.innerHTML='<span>There are a few articles and fine food</span>';
break;
case "http://joaner.com/picture.php":
headspan.innerHTML='<span>Maybe you will eat the display</span>';
break;
case "http://t.qq.com/Vague-smile":
headspan.innerHTML='<span>I say</span>';
break;
case "http://joaner.com/about.php":
headspan.innerHTML='<span>What's I doing</span>';
break;
case "http://joaner.com/other.php":
headspan.innerHTML='<span>Mmm,little things</span>';
}
});
});
</script>
</head>
<body>
<ul>
<span id="headSpan"></span>
<ul>
<a href="http://joaner.com/"><li>1</li></a>
<a href="http://joaner.com/picture.php"><li>2</li></a>
</ul>
</ul>
</body>
</html>乌镇程序员 2011-07-03
- 打赏
- 举报
IE8，访问http://joaner.com/，上面的菜单功能正常。
改一下昵称 2011-07-03
- 打赏
- 举报
id这些都不会出错，IE也米有报错哎，顺带纠正一下HTML代码结构
<ul>
<a ...><li>...</li></a>
........
</ul>
<ul>
<a ...><li>...</li></a>
........
</ul>
挨踢直男 2011-07-03
- 打赏
- 举报
所有代码发来看看
