代码之家 › 专栏 › 技术社区 › Annagram

Jquery Javascript函数,简单错误,找不到!

function internet-explorer javascript

0

Annagram · 技术社区 · 7 年前

当我的页面加载时,它调用如下函数:

<body onLoad='changeTDNodes()'>

它调用的代码如下:

enter code here


<script src='jquery-1.4.2.min.js' type='text/javascript'></script>

<script>

function changeTDNodes() {
var threshValue = 10;
$(".threshold").each(function(elem) {
if($("b",elem).innerText > threshValue) {
elem.addClass("overThreshold");
}
});
});

}

我有正确的CSS类设置 .被推翻{ td{字体-size:72px;} }

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'             'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html>
<head>
<title>Livermore Readerboard</title>
<script src='jquery-1.4.2.min.js' type='text/javascript'></script>

<script>
$(function() {
var threshValue = 10;
$(".threshold").each(function(elem) {
if($("b",elem).innerText > threshValue) {
elem.addClass("overThreshold");
}
});
});

</script>
<style type='text/css'>
#InnerRight {
width: 50% !important;
position: relative !important;
float: left !important;
}
#InnerLeft {
width: 49% !important;
position: relative !important;
float: right !important;
}
.overThreshold {
td{font-size:72px;}
th{font-size:72px;}
}
</style>
</head>
<body>
<div id='InnerLeft'>
<table border=1 cellpading=1 cellspacing=0>
<tr align=right>
<td align=left><b>Split/Skill</b></td>
<td align=center><B>CIQ</b></td>
<td align=center><b>EWT</b></td>
<td align=center><b>Agents Staffed</b></td>
<td align=center><b>Avail</b></td>
</tr>
<tr align=right>
<td align=left><b>LEAD_IP_REP_video</b></td>
<td align=center class='threshold'><B>0</b></td>
<td align=center><b>:00</b></td>
<td align=center><b>3</b></td>
<td align=center><b>2</b></td>
</tr>
<tr align=right>
<td align=left><b>LEAD_IP_REP_tier</b></td>
<td align=center class='threshold'><B>0</b></td>
<td align=center><b>:00</b></td>
<td align=center><b>3</b></td>
<td align=center><b>2</b></td>
</tr>
<tr align=right>
<td align=left><b>IP_REP_video</b></td>
<td align=center class='threshold'><B>60</b></td>
<td align=center><b>10:12</b></td>
<td align=center><b>58</b></td>
<td align=center><b>0</b></td>
</tr>
<tr align=right>
<td align=left><b>IP_REP_hsi</b></td>
<td align=center class='threshold'><B>34</b></td>
<td align=center><b>18:15</b></td>
<td align=center><b>56</b></td>
<td align=center><b>0</b></td>
</tr>
<tr align=right>
<td align=left><b>IP_REP_hn</b></td>
<td align=center class='threshold'><B>0</b></td>
<td align=center><b>3:48</b></td>
<td align=center><b>3</b></td>
<td align=center><b>0</b></td>
</tr>
<tr align=right>
<td align=left><b>IP_REP_cdv</b></td>
<td align=center class='threshold'><B>6</b></td>
<td align=center><b>14:53</b></td>
<td align=center><b>56</b></td>
<td align=center><b>0</b></td>
</tr>
<tr align=right>
<td align=left><b>CommOps FieldCare</b></td>
<td align=center class='threshold'><B>0</b></td>
<td align=center><b>0</b></td>
<td align=center><b>0</b></td>
<td align=center><b>0</b></td>
</tr>
</table>
</div>
</body>
</html>

2 回复 | 直到 16 年前

1

kibibu laffuste 16 年前

如果可能的话,使用 id 在你的元素上,然后使用 document.getElementById() (或者,更好的方法是使用Dojo、MooTools或JQuery来简化代码)。

<td id="cell-repair-video">Repair value is <b>23</b></td>
<td id="cell-ppv">PPV value is <b>5</b></td>

var RepairVideo_cell = document.getElementById("cell-repair-video");
var RepairVideo_value = RepairVideo_cell.getElementsByTagName("b")[0];

在JQuery(以及其他)中,您可以很容易地使用类来确定哪些元素需要设置阈值

在本例中,您的html如下所示:

<td class="threshold">Repair value is <b>23</b></td>
<td class="threshold">PPV value is <b>5</b></td>

还有你的 整个的 JavaScript看起来像:

$(function() {
  var threshValue = 10;
  $('.threshold').each(function(index) {
    var thisValue = parseFloat( $('b', this).text() );
    if(thisValue > threshValue) {
      $(this).addClass('overThreshold');
    }
  });
});

风格 td 和 th

td.overThreshold, th.overThreshold {
  background: #F00; /* for example */
}

2

1

Nathan 16 年前

想必你是在通过什么东西去 applyThresholds innerHTML打开的函数 myvalue

我猜那个疯子 document.getElementsByTagName('B')[36]; 代码在某个点返回未定义。您应该在applyThresholds中放入一些代码来检查是否通过了无效参数。比如:

if(myvalue == null || mycell == null) {
   return;
}