在javascript中更改鏈接顏色而不是CSS（懸停）---在jsfiddle而不是瀏覽器中工作？

感謝所有幫助球員。它可以在jsfiddle/jsbin（翻轉和滾動）中完美工作，但是我似乎無法讓它在瀏覽器中實際運行。在javascript中更改鏈接顏色而不是CSS（懸停）---在jsfiddle而不是瀏覽器中工作？

的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') 
    } 
});

來源

2012-05-03 ndreckshage

您的懸停jQuery選擇器已損壞，因爲您的字段不是''字段，它只是一個帶'input'類的div。因此，您的選擇器永遠不會啓動懸停，因爲您不可能有一個「輸入」字段，它同時也是一個「div」。看起來你有很多很棒的解決方案可以從 – veeTrain

YAY的方式。我想到了。希望沒有人在做這件事，我沒有浪費任何時間。我在這裏張貼因此，如果任何人有在未來這個問題...

我檢查了草稿視圖看到的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>

SO ....如果任何人試圖得到這樣的工作守則（隨機顏色，鏈接懸停），這裏是最後的代碼爲我工作（比我在使用它的實際文件不同）。

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>

$(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-04 03:45:32 ndreckshage

您應該使用$("div.input")代替$("div input") （見之間的點）

來源

2012-05-03 12:08:53

中挑選出來，或者他的div有兩個類'div'和'input'，所以他可能真的想'div.div.input' – veeTrain

是。錯過了「div」本身的類名。 @ nickd3，恕我直言，這樣的類名稱並不好。 :) –

雅，它不是我最初使用的，只是今天早上打字之前工作 – ndreckshage

嘗試這http://jsfiddle.net/hdsuT/

$("div.input").hover(function() { 
    $(this).find('a').addClass("blue"); 
}, function() { 
    $(this).find('a').removeClass("blue"); 
});

來源

2012-05-03 12:12:06

像這樣將有助於

<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-03 12:14:12 Sethunath

這是一個很大的幫助。萬分感謝 – ndreckshage

這樣做

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

<a href="" onmouseover="changcolor()" id="iDofyourLink"></a>

來源

2012-05-03 17:05:17

在javascript中更改鏈接顏色而不是CSS（懸停）---在jsfiddle而不是瀏覽器中工作？

回答

相關問題