0

感谢您的所有帮助。它在 jsfiddle/jsbin（翻转和翻转）中完美运行，但我似乎无法让它在浏览器中实际运行。

JavaScript - 在你们的帮助下进行了一些编辑，以匹配我如何学习 Math.random 等

colors = ['red','blue','green','gray','black','yellow'];
$(".test a").hover(function() {
  randomColor = Math.floor(Math.random() * colors.length - 1)
  $(this).css('color',colors[randomColor])
    }, function() {
      $(this).css('color', '#000000')
});

HTML（实际上使用不同的 html，但这是从 jsbin 中提取的并且不起作用）

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>  
<script type="text/javascript" src="randomcolor.js"></script>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
</style>
</head>
<body>
    <div class="test"><a href="http://test.com">WORKKKKK</a></div>
</body>
</html>

与浏览器代码的唯一区别是我在 randomcolor.js 文件中有 js，在标题中调用

<script type="text/javascript" src="randomcolor.js"></script>

从我在网上找到的内容来看，这与“onload”有关吗？我该如何实施？我也试过把这个脚本直接放在正文中的html中，我仍然无法让它工作。

但是再次感谢你们最初的帮助，让它在 jsfiddle 中正常工作绝对是一个好的开始！

也只是为了提供尽可能多的信息 - 尝试添加此 onload 但仍然无法正常工作

$(window).load(function(){
    colors = ['#ffffff', 'blue', 'green', 'gray', 'black', 'yellow'];
    $(".test a").hover(function() {
        randomColor = Math.floor(Math.random() * colors.length - 1)
        $(this).css('color', colors[randomColor])
    }, function() {
        $(this).css('color', '#000000')
    }
});
4

5 回答 5

1

你应该使用$("div.input")而不是$("div input") （见中间的点）

于 2012-05-03T12:08:53.603 回答
1

这样的事情会有所帮助

<div class="test"><a href="http://test.com">Test</a></div>

colors = ['red','blue','green','gray','black','yellow'];
$(".test a").hover(function() {
  rand = parseInt(Math.random()*10)%colors.length
  $(this).css('color',colors[rand])
});

请检查

http://jsfiddle.net/sethunath/WNGKv/

于 2012-05-03T12:14:12.193 回答
0

试试这个http://jsfiddle.net/hdsuT/

$("div.input").hover(function() {
  $(this).find('a').addClass("blue");
}, function() {
  $(this).find('a').removeClass("blue");
});
于 2012-05-03T12:12:06.083 回答
0

这是做到这一点的方法

function changcolor(){
    var link=document.getElementById("iDofyourLink").style.color = "#ffffff";
}

<a href="" onmouseover="changcolor()" id="iDofyourLink"></a>
于 2012-05-03T17:05:17.847 回答
0

耶。我想到了。希望没有人在做这件事，我也没有浪费任何人的时间。我在这里发布它，所以如果其他人将来有这个问题......

我查看了草稿视图以查看 jsfiddle 的来源（在询问之前应该想到这一点）。它显示为 javascript -->

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
colors = ['red', 'blue', 'green', 'gray', 'black', 'yellow'];
$(".test a").hover(function() {
    randomColor = Math.floor(Math.random() * colors.length - 1)
    $(this).css('color', colors[randomColor])
}, function() {
    $(this).css('color', '#000000')
});
});//]]>  
</script>

所以我决定将 randomcolor 作为一个单独的文件离开，为了让它工作，我把 CDATA 像这样 -->

<script type="text/javascript" src="randomcolor.js"><![CDATA[//]]></script>

所以....如果其他人试图让这样的代码工作（随机颜色，链接悬停），这是对我有用的最终代码（与我使用它的实际文档不同）。

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script>  
<script type="text/javascript" src="randomcolor.js"><![CDATA[//]]></script>
</head>
<body>
    <div class="test"><a href="http://test.com">Please work</a></div>
</body>
</html>

JS

$(window).load(function(){
colors = ['red', 'blue', 'green', 'gray', 'black', 'yellow'];
$(".test a").hover(function() {
    randomColor = Math.floor(Math.random() * colors.length - 1)
    $(this).css('color', colors[randomColor])
}, function() {
    $(this).css('color', '#000000')
});
});

我希望这对其他人有帮助！

于 2012-05-04T03:45:32.077 回答