0

事情是这样的，账单是从点阵打印机出来的，纸是连续格式的（就像你们中的大多数人可能在销售部门看到的那样）。有时为了完成一笔销售，推销员会拿一张账单（不是打印一张空白的）手工制作。现在的系统可以通过让人们手动设置值然后继续增加值来处理这种跳跃。

但是还有一个空白，我必须在空白之前突出显示该行（只是带有 id 的单元格），只是为了让人们更清楚地看到有人拿了一张账单，手工制作并且还没有注册。

是这样的：（id列的css类是clave，意思是key）

|  id | qtty | price |
|-----+------+-------+
| 001 |   25 |     3 |
| 002 |   35 |     5 |
| 004 |   86 |     3 |
| 005 |   96 |     1 |
| 007 |   85 |     2 |
| 008 |   24 |     1 |

因此 id 002 和 005 的行应该显示 font-weight: bold css，以使丢失的钞票更容易被发现。我遇到的另一个问题是这个 html 结构不是表格，它实际上是由层（div 标签）组成的。

我有很多代码，我不知道为什么它不工作......你可以看到它在这里运行： in this JSbin

4

3 回答 3

1

经过很长时间看了你的解释，我认为这就是你想要做的

$(document).ready(function() {
    $(".clave").each(function(i, v) { // loop through each elem with class=clave
        var $next = $.trim($(".clave").eq(i + 1).text()); // get next text
        var $ele = $.trim($(v).text()); // get this text
        if ((+$next) - (+$ele) > 1) { // subtract next from now - if greateer than 1
            $(v).css('color', 'red').css('font-weight','bold'); // turn current text bold
        };
    });
});​

编辑：忘记使用 $.trim() 而不是 .trim() 来支持跨浏览器

http://jsfiddle.net/Zxc2w/

http://jsbin.com/isaruj/5/

于 2012-10-05T18:19:25.927 回答
1

解决问题的一种方法：

function ensureConsecutive(el) {
    if (!el || !el.parentNode.nextElementSibling) {
        return false;
    }
    else {
        var curId = parseInt(el.textContent,10),
            parent = el.parentNode,
            nextRow = parent.nextElementSibling,
            nextId = parseInt(nextRow
            .getElementsByClassName('id')[0].textContent,10);

        if (curId + 1 !== nextId) {
            $(el).addClass('nonConsecutive');
        }
    }
}

$('td.id').each(
    function(i,el){
        ensureConsecutive(el);
    });

JS 小提琴演示。

虽然这不是跨浏览器兼容的，但由于nextElementSibling和textContent使用，这可能成为使用更多 jQuery 方法或通过替代纯 JavaScript 方法（例如innerText）的跨浏览器。

于 2012-10-05T18:22:38.013 回答
0

使用 jQuery 选择器，然后遍历所有选择并使用 .css 方法更改 css

于 2012-10-05T17:50:56.570 回答