JQuery排除某些HTML行
JQuery exclude certain HTML rows
我有一个HTML表,其结构如下所示。它是用MySQL查询的结果填充的。
<div class="timecard">
<table class="misc_items timecard_list" border="0" cellpadding="2" cellspacing="0" style="margin:0 auto;">
<tbody>
<tr class="display_row odd">
<td align="left" class="job_code" style="color:#000099">2400-Orchard</td>
<td align="right">9:47am</td>
<td align="right">5/19/2014</td>
<td align="right" class="hrs">01:00</td>
</tr>
<tr class="display_even row">
<td align="left" class="job_code" style="color:#000099">Out</td>
<td align="right">12:37am</td>
<td align="right">5/17/2014</td>
<td align="right" class="hrs">0:00</td>
</tr>
<tr class="display_odd row">
<td align="left" class="job_code" style="color:#000099">1200-Duffy's</td>
<td align="right">12:37am</td>
<td align="right">5/17/2014</td>
<td align="right" class="hrs">2:00</td>
</tr>
</tbody>
</table>
</div>
<div id="total"></div>
和一个javascript jquery,它遍历表并汇总各个"job_code"时钟的结果。但是,它还包括了"Out"时钟,总共有"NaN"。是否有可能从打印或附加的结果中排除这一点?下面是JQuery。
$(document).ready(function () {
var timeString = $(this).next('td.hrs').text();
var components = timeString.split(':');
var seconds = components[1] ? parseInt(components[1], 10) : 0;
var hrs = parseInt(components[0], 10) + seconds / 60;
total += hrs;
var temp = [];
$('.job_code').each(function (index, element) {
var text = $(this).text();
temp.push(text);
});
// remove duplicates
var job_code = [];
$.each(temp, function (index, element) {
if ($.inArray(element, job_code) === -1) job_code.push(element);
});
var sum = {};
$.each(job_code, function (index, element) {
var total = 0;
$('.job_code:contains(' + element + ')').each(function (key, value) {
var timeString = $(this).siblings('td.hrs').text();
var components = timeString.split(':');
var seconds = components[1] ? parseInt(components[1], 10) : 0;
var hrs = parseInt(components[0], 10) + seconds / 60;
total += hrs;
sum[index] = {
'job_code': element,
'total': total
};
});
});
console.log(sum);
$.each(sum, function (index, element) {
$('#total').append('<p>Total for ' + element.job_code + ': ' + element.total + '</p>');
});
});
链接到jsFiddle: http://jsfiddle.net/2D5fb/2/
下面是通过添加
</table> and </div> end tags, which seem to have resolved the NaN issue.
好的。我必须编辑代码的temp
部分,使其看起来像这样。
var temp = [];
$('.job_code').each(function (index, element) {
var text = $(this).text();
if (text != 'Out') {
temp.push(text);
}
});
这里还有一个jsFiddle的链接,它显示了它的工作原理。http://jsfiddle.net/2D5fb/3/
特别感谢@Barmar,你的评论让我走上了正轨。
相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何设置html元素填充的动画
- 使用JS如何动态更改显示的html文件中的文本背景颜色
- 如何在 AngularJS 中将复杂的表达式排除在我的 HTML 之外
- 正则表达式用于匹配段落中的单词,但排除内部 HTML 标记
- 我需要对我的HTML/JavaScript代码进行一些故障排除
- 如何在运行时使用jquery在html页面中包含和排除电话号码字符串
- 从dom获取整个html,但排除一些元素
- 需要帮助对学校项目的html文件中的Javascript代码进行故障排除
- 使用Google Translate API翻译时排除HTML标记
- 从脚本标签中排除HTML
- Jquery从HTML方法中排除元素
- 如何排除某些部分的HTML在cheerio
- 是否有办法从某些HTML元素中排除MathJax处理?
- 在PHP中排除特定的html标签和内容
- JQuery排除某些HTML行
- innerHtml中的Javascript搜索排除html标记
- jQuery在文本区域显示html,排除一个元素
- 如何用HTML标签包装文本,但排除某些HTML标签内的文本
- 如何为table.rows.length函数排除html表中的标题行.Java脚本中的