Question

当窗口宽度低于500px时，我正在对我的网站进行表格显示优化，其中我希望表格只有2列;标题，预告片。

截至目前，我正在这样链接：

var $rows = $(".zn-listviewtable tr");
if ($rows.children('td').length > 3) {
    $rows.find("td:gt(2)").remove().end().find("th:gt(2)").remove().end().find("td:lt(1)").remove().end().find("th:lt(1)").remove();
}

正如您所看到的，我有if语句检查是否有超过3列（或td），如果有，则删除所有> 2和{{1} } 1。

唯一的< 1字段是每行中的复选框字段。并非我的所有表格都包含此字段，因此我只想将<应用于具有此字段的表格。

有没有办法在链接过程中对此进行检查，而不是将其拆分，然后以单独的方式重新开始，避免它最终结束：

remove()

Answer 1

您正在寻找此插件：jQuery iff: A chainable "if" statement

它允许你重写：

function my_test( x ) {
  return x === 'bar';
}

var elem = $('div');
elem.append( '1' );
if ( my_test( 'foo' ) ) {
  elem.append( '2' );
}
elem.append( '3' );

......进入这个：

function my_test( x ) {
  return x === 'bar';
}

$('div')
  .append( '1' )
  .iff( my_test, 'foo' )
    .append( '2' )
    .end()
  .append( '3' );

在每个示例中，'2'和'1'之间未附加'3'，因为my_test函数调用返回false。

如果传递给iff的参数是true，或者是一个在调用时返回true的函数，则会传递所有选定的元素。否则，将删除所有元素，并传递一个空的jQuery对象。如果传递了函数引用，则以下任何参数都将传递给该函数。

在回调中，this引用了jQuery元素集合。请注意，iff被视为“破坏性”遍历操作，即使没有删除任何元素，也可以使用.end()还原。

您的代码可以按如下方式重写：

$(".zn-listviewtable tr")
  .iif(function() {
    return this.children('td').length > 3;
  })
    .find("td:gt(2), th:gt(2), td:lt(1), th:lt(1)").remove();

Answer 2

首先，写起来更容易：

$rows.find("td:gt(2)").remove().end().find("th:gt(2)").remove().end().find("td:lt(1)").remove().end().find("th:lt(1)").remove();

as：

$rows.find("td:gt(2),th:gt(2),td:eq(0),th:eq(0)").remove();

如果您想链接所有内容，需要将一个类分配给table，其中包含第一列复选框（或第一列td和th）

否则，你可以：

if ($rows.find('td:eq(0):has(input[type="checkbox"])').length)
    $rows.find("td:eq(0),th:eq(0)").remove();

$rows.find("td:gt(1),th:gt(1)").remove();

有条件地删除复选框列，并留下2列

jQuery链接if语句

2 个答案: