0

請求書はドット マトリックス プリンターから出力され、用紙は連続フォーマットです (多くのユーザーが販売部門で見たようなものです)。販売をカバーするために、セールスマンは請求書 (空白の印刷物ではない) を手で作ることがあります。現在のシステムは、人々が手動で値を設定できるようにすることでこのジャンプを処理でき、その後値を増やし続けます。

しかし、ギャップが残っているので、ギャップの前の行 (ID のセルのみ) を強調表示する必要があります。これは、誰かが請求書を受け取り、手で作成し、まだ登録していないという事実をより明確にするためです。

それは次のようになります: (id 列の css クラスは clave、つまりキーです)

|  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 で表示され、欠落している請求書をより見つけやすくする必要があります。私が抱えているもう1つの問題は、このhtml構造がテーブルではなく、実際にはレイヤー(divタグ)で構成されていることです。

私はコードの多くを持っていますが、なぜそれが機能していないのかわかりません...そして、あなたはそれがここで実行されているのを見ることができます： このJSbinで

4

3 に答える 3

1

問題への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メソッド（innerText1つ）を使用してクロスブラウザになる可能性があります。

于 2012-10-05T18:22:38.013 に答える
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
        };
    });
});​

EDIT：クロスブラウザのサポートのために .trim() の代わりに $.trim() を使用するのを忘れました

http://jsfiddle.net/Zxc2w/

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

于 2012-10-05T18:19:25.927 に答える
0

jQueryセレクターを使用してから、選択したすべてを繰り返し処理し、.cssメソッドを使用してcssを変更します

于 2012-10-05T17:50:56.570 に答える