這個簡單的javascript代碼怎么了？
[英]What's wrong with this simple javascript code?
問題描述
我需要從此鏈接http://jsfiddle.net/bQfb6/2/編譯代碼
JavaScript似乎有問題。 文字顏色不變。
我的html文件：
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<style type="text/css">
.cell1 {
border:1px solid red;
background:#eee;
padding:10px;
}
</style>
<script type="text/javascript">
$('.cell1').each(function (i, n) {
if ($(n).text() < 5) $(n).css('color', 'green');
});
</script>
</head>
<body>
<table>
<tr>
<td class="cell1">20</td>
<td class="cell1">5</td>
<td class="cell1">1</td>
<td class="cell1">3</td>
<td class="cell1">10</td>
<td class="cell1">15</td>
</tr>
</table>
</body>
</html>
ps對不起，這樣的菜鳥問題，我真的需要您的幫助才能繼續
4 個解決方案
解決方案1
3 已采納 2014-09-10 12:19:22
首先，您需要在已經構建DOM時運行代碼； 就目前情況而言，它是在此之前被調用的，因此.cell1選擇器找不到任何元素。
其次，代碼本身可以簡化（無需使用.each ，足以為css設置回調），如下所示：
$(function() {
$('.cell1').css('color', function(_, val) {
return this.textContent < 5 ? 'green' : val;
});
});
解決方案2
2 2014-09-10 12:15:59
您需要將代碼包裝在ready處理程序中：
$(document).ready(function(){
// your code here
});
而且，您的操作方式有誤，請執行以下操作：
$(document).ready(function(){
$('.cell1').each(function (i, n) {
if (+($(n).text())< 5){ // + is used to convert into number
$(this).css('color', 'red');
}
});
});
解決方案3
0 2014-09-10 12:19:00
您必須等到所有DOM結構准備就緒，然后再應用您的jquery腳本。 您可以將代碼包裝在$(document).ready(function(){}); 或$(function(){});
$(function(){
$('.cell1').each(function(i, n) {
if($(n).text() < 5) $(n).css('color', 'green');
});
});
解決方案4
0 2014-09-10 12:19:03
另外一項更改，您必須使用parseFloat進行數值比較
if(parseFloat($(n).text()) < 5)
這個簡單的Javascript有什么問題？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.