0

我正在尝试根据两个条件在特定位置的a<table>内插入一个元素。<div>

条件1：基于页面Num

条件2：基于ordernum。

例如 ：

 <div id="printContainer">
      <table class="BKG pg1" id="tbl-09-338785" data-ordernum="0">
      </table>
      <table class="BKG pg1" id="tbl-09-338786" data-ordernum="1">
      </table>
      <table class="BKG pg2" id="tbl-09-338787" data-ordernum="0">
       </table>
      <table class="BKG pg2" id="tbl-09-338788" data-ordernum="1">  
      </table>
      <table class="BKG pg3" id="tbl-09-338789" data-ordernum="0">
      </table>
    </div>

如果我想进入

<table class="BKG pg2" id="tbl-09-338790" data-ordernum="5">

在divthen 它应该附加到中间的列表中

<table class="BKG pg2" id="tbl-09-338788" data-ordernum="1">  and 
<table class="BKG pg3" id="tbl-09-338789" data-ordernum="0">

现在如果我想进入

<table class="BKG pg2" id="tbl-09-338791" data-ordernum="3">

在divthen 它应该附加到中间的列表中

<table class="BKG pg2" id="tbl-09-338788" data-ordernum="1">  and 
<table class="BKG pg2" id="tbl-09-338790" data-ordernum="5">

提琴手

4

1 回答 1

1

试试这个尺寸：http: //jsfiddle.net/S4yhS/

这项工作由一个insert函数处理：

function insert(page, id, ordernum) {
    var didInsert = false;
    var table = $("<table>", {
        'class': "BKG pg" + String(page),
        'id': id,
        'data-ordernum': ordernum
    });

    $(".pg" + String(page)).each(function (idx, element) {
        if ($(element).data("ordernum") > ordernum) {
            $(element).before(table);
            didInsert = true;
        }
    });

    if (!didInsert) {
        $(".pg" + String(page)).last().after(table);
    }
}

它是这样工作的：

  1. 循环遍历页面上的每个表。假设这些表已按以下顺序排序ordernum
  2. 如果订单号大于给定值，则在其前面插入给定表格。
  3. 如果不存在更大的订单号，则在页面末尾插入给定的表格。

请注意，这是使用jQuery完成的。没有它你也可以做同样的事情，但更难。但是，基本方法将保持不变。

还要注意，String()在page值上使用并不是绝对必要的，但我喜欢显式地进行类型转换，而不是让语言为我做这件事。

测试：

insert(2, "tbl-09-338790", 5);
insert(2, "tbl-09-338791", 3);

结果：

<div id="printContainer">
    <table class="BKG pg1" id="tbl-09-338785" data-ordernum="0"></table>
    <table class="BKG pg1" id="tbl-09-338786" data-ordernum="1"></table>
    <table class="BKG pg2" id="tbl-09-338787" data-ordernum="0"></table>
    <table class="BKG pg2" id="tbl-09-338788" data-ordernum="1"></table><table class="BKG pg2" id="tbl-09-338791" data-ordernum="3"></table><table class="BKG pg2" id="tbl-09-338790" data-ordernum="5"></table>
    <table class="BKG pg3" id="tbl-09-338789" data-ordernum="0"></table>
</div>

（注意：前后不要加换行符，但显示要一致）

参见：之前和之后

于 2013-07-30T23:43:07.493 回答