标签: html-table

如果其中一个列使用CSS为空,则隐藏表行

可能重复:
如果行包含空列,则隐藏行

可以使用CSS隐藏此表中包含空单元格的行.我已经尝试过jQuery并且它现在不能正常工作..这是我使用的,它没有做任何事情!

$('.EventDetail tr').each(function(){      
    if ($('td:empty',this).length > 0))
    $(this).hide();
});
Run Code Online (Sandbox Code Playgroud)

这个jQuery没有什么不对,有吗?我想看看我们能否display:none为选定的行做些什么?是否可以使用CSS实现?

<table cellpadding="10" class ="EventDetail">
    <tr>
        <td class="TableFields"><em>Who Should Enroll?:</em></td>
        <td>Everyone 18 and older who would like to attend</td>
    </tr>       
    <tr>
        <td class="TableFields"><em>Handicapped Access:</em></td>
        <td>Yes</td>
    </tr>
    <tr>
        <td class="TableFields"><em>Parking Notes:</em></td>
        <td></td>
    </tr>
    <tr>
        <td class="TableFields"><em>Instructor:</em></td>
        <td>John Filler</td>
    </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

javascript jquery row html-table cells

-2
推荐指数
1
解决办法
3324
查看次数

JQuery在嵌套的tr中找到最近的父tr

如何从最近的子 tr 中找到父 tr,例如从第二个子 tr 中找到父 tr,我怎样才能找到第一个父 tr?

下面是我一直在使用的两个表结构:

1)

 <table>
        <tr class="menu">
            <td><input type='text' class='parent' value='First Parent'></td>  
            <tr class="sub-menu">
                <td><input type='text' class='firstchild' value='First Child'>
                </td>

            </tr>
             <tr class="sub-menu">
                <td><input type='text' class='secondchild' value='Second Child'>
                </td>
            </tr>   
        </tr>
            <tr class="menu" >
            <td ><input type='text' class='parent' value='Second Parent'></td> 
            <tr class="sub-menu">
                <td><input type='text' class='firstchild' value='First Child'>
                </td>
                </tr>
            </tr>
    </table>
Run Code Online (Sandbox Code Playgroud)

2)

    <table>
    <tr class="menu">
        <td><input type='text' class='parent' value='First Parent'></td>  
</tr>
        <tr class="sub-menu">
            <td><input type='text' class='child' value='First Child'>
            </td>
      </tr>

         <tr class="sub-menu">
            <td><input type='text' …
Run Code Online (Sandbox Code Playgroud)

html jquery html-table parent closest

-2
推荐指数
1
解决办法
4万
查看次数

jQuery获取链接ID

我正在尝试获取动态生成表的id属性.所以,如果我点击第一个链接,我想得到"editEmploee-4".

<table id="example" class="table span12 table-bordered table-hover">
   <thead>
      <tr>
         <th>Firstname</th>
         <th>Lastname</th>
         <th>Edit</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Person 1</td>
         <td>Name Person 1</td>
         <td><a href="#" class = "editDialog" id="editEmployee-4"><img src="img/edit.png" height="20" /></a></td>
      </tr>
      <tr>
         <td>Person 2</td>
         <td>Name Person 2</td>
         <td><a href="#" class = "editDialog" id="editEmployee-5"><img src="img/edit.png" height="20" /></a></td>
      </tr>
      <tr>
         <td>Person 3</td>
         <td>Name Person 3</td>
         <td><a href="#" class = "editDialog" id="editEmployee-47"><img src="img/edit.png" height="20" /></a></td>
      </tr>
   </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

我已经尝试过这段代码,但我总是得到相同的ID.

var data = $( "a[id][class=editDialog]" ).attr('id');
Run Code Online (Sandbox Code Playgroud)

你知道如何获得动态生成的链接ID吗?

javascript jquery html-table

-2
推荐指数
2
解决办法
126
查看次数

在表格的每一行之后添加一行

 $("table:visible").each(function() {
    $(this).find("tr").each(function(){

      var row='<tr><td>val</td></tr>';
$(row).insertAfter("#mytable tr:first");


        });

});
Run Code Online (Sandbox Code Playgroud)

我想在表格的每一行之后添加一行.我现在使用的是在第一行之后添加一行.例如:

我的桌子有五个.我运行这个js后会有10个.有什么建议吗?

javascript jquery html-table

-2
推荐指数
1
解决办法
61
查看次数

如何使用取消按钮返回模型的先前状态

我在这里有这个plunkr ,它显示了一个可编辑的表格.

以下是表格的HTML代码:

  <body ng-controller="MainCtrl">
    <table style="width:100%">
  <tr>
    <th>Name</th>
    <th>Is enabled?</th>        
    <th>Points</th>
  </tr>
  <tr ng-repeat="fooObject in fooObjects | orderBy:'points'">
    <td><input ng-model="fooObject.name" ng-disabled="fooState!='EDIT'"/></td>
    <td><input ng-model="fooObject.isEnabled" ng-disabled="fooState!='EDIT'"/></td>     
    <td><input ng-model="fooObject.points" ng-disabled="fooState!='EDIT'"/></td>
    <td>
      <a href="#" ng-click="handleEdit(fooObject, 'EDIT', $index)">Edit</a>
      <a href="#" ng-click="handleEditCancel(fooObject, 'VIEW', $index)">Cancel</a>
    </td>
  </tr>
</table>
  </body>
Run Code Online (Sandbox Code Playgroud)

我希望Cancel行中的链接显示前一个状态,fooObject就好像该行从未被触及一样.

以下是AngularJS控制器中的代码,它似乎只要我"orderBy:'points'"ng-repeat表达式中没有,但是不起作用:

app.controller('MainCtrl', function($scope) {
  $scope.fooObjects = [
    {"name": "mariofoo", "points": 65, "isEnabled": true}, 
    {"name": "supermanfoo", "points": 47, "isEnabled": false}, 
    {"name": "monsterfoo", "points": 85, "isEnabled": true}
    ]; …
Run Code Online (Sandbox Code Playgroud)

html-table edit dirty-data angularjs angularjs-ng-repeat

-2
推荐指数
1
解决办法
2162
查看次数

如何使用Jquery在新创建的行上获取click事件

我有一个table:

<table id="myTable" style="cursor :pointer;">
 <tr>
   <td>col 1</td><td>col2</td>
 </tr>
 <tr>
   <td>field</td><td>Field 2</td>
 </tr>
 <tr>
   <td>another field</td><td>one more field</td>
 </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

当我点击row这个代码添加一个新的row:

$("#myTable tr").click(function(){
   $(this).addClass('selected').siblings().removeClass('selected');
   var value=$(this).find('td:eq(1)').html();
   if (value) {
   alert('adding New Row !')
   $('#myTable').find('tbody:last').append('<tr><td>new Field</td><td>New Field</td></tr>');
    }
});
Run Code Online (Sandbox Code Playgroud)

JSFiddle演示

但是现在当我点击新创建时row没有任何附加内容.为什么row不创建另一个?

有没有办法做到这一点 ?

javascript jquery html-table

-2
推荐指数
1
解决办法
46
查看次数

使用 rowspan 每隔一行着色

我想为表格的每一行着色。虽然每个常规表格都可以使用此着色:

$('tr:odd').css( "background-color", "orange" );
Run Code Online (Sandbox Code Playgroud)

就我而言,有几个rowspan,使任务变得更加困难。

这是我想要的输出:

想要的桌子

使用上面的代码不会导致预期的结果:

在此处输入图片说明

这是一个小提琴

$('tr:odd').css( "background-color", "orange" );
Run Code Online (Sandbox Code Playgroud)
$('tr:odd').css("background-color", "orange");
Run Code Online (Sandbox Code Playgroud)

javascript css jquery html-table

-2
推荐指数
1
解决办法
1189
查看次数

如何在html中创建嵌套表

我需要创建一个带有内表的 HTML 表,如下图所示:

[示例][1] 我很困惑是应该为左侧和右侧表创建两个单独的表还是将它们组合在一个表中

我尝试了下面的示例,但它没有以我想要的格式生成,基本上,它没有生成内部 HTML 表:

<table >

  <thead>
    <tr>
      <th>VITAL SIGNS</th>
      <th>FREQUENCY</th>
      <th></th>
      <th>TOTAL SUPPORT</th>
      <th>ASSIST</th>
      <th>SEE CARE</th>
      <th>FREQUENCY</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <th>Temperature</th>
      <th><input type="text" /></th>
      <th>SKIN CARE</th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
    <tr>
      <th>BP</th>
      <th><input type="text" /></th>
      <th>APPLY LOTION</th>
      <th><input type="checkbox" /></th>
      <th><input type="checkbox" /></th>
      <th><input type="checkbox" /></th>
      <th><input type="text" /></th>
    </tr>
    <tr>
      <th>Pulse</th>
      <th><input type="text" /></th>
      <th>ACTIVITY</th>
      <th></th>
      <th></th>
      <th></th>
      <th></th>
    </tr>
    <tr>
      <th>Respiration</th>
      <th><input type="text" /></th>
      <th><input type="checkbox" />
        <input type="checkbox" />
      </th> …
Run Code Online (Sandbox Code Playgroud)

html datatable html-table nested-table

-2
推荐指数
1
解决办法
7621
查看次数

ODD/EVEN表中只有两列

我想创建这样的效果来改变背景ODD/EVEN到每个<TR>只有字段class="important"..下面它是一个表的例子...它不是静态的...它是由PHP创建的,来自Mysql的数据...

<tr class="change">
   <td>1111</td>
   <td>2222</td>
   <td>3333</td>
   <td>4444</td>
   <td class="important">5555</td>
   <td class="important">6666</td>
<tr>
<tr class="change">
   <td>1111</td>
   <td>2222</td>
   <td>3333</td>
   <td>4444</td>
   <td class="important">5555</td>
   <td class="important">6666</td>
<tr>
Run Code Online (Sandbox Code Playgroud)

因此,我希望每个<TR>ODD或EVEN仅根据CLASS IMPORTANT对表中的几个单元格进行影响

html css html-table class

-3
推荐指数
1
解决办法
388
查看次数

如何为html中所有标题中的一个标题创建表格子标题

嗨,我必须创建一个如下图所示的表格。

在此处输入图片说明 请帮我拿到那张桌子。我正在研究 angular 4 项目

html html-table

-3
推荐指数
1
解决办法
2520
查看次数

从特定 tr 获取 td 值(鼠标悬停)

我的问题是 js 可排序表,我也使用鼠标悬停它。问题是当我重新使用我的表时,悬停 url 没有更新,我在寻找如何获得特定的 tr 我选择了第一个 td 的值。

我尝试了不同的变体,例如:

$this.find('td:eq(0)') 
Run Code Online (Sandbox Code Playgroud)

或与

getElementById("trselect")
Run Code Online (Sandbox Code Playgroud)

没有任何效果。

我将它与鼠标悬停一起使用,并且可能正在寻找类似的东西:

document.location.href = "details/" + $('tr').find('td:first-child').text();
Run Code Online (Sandbox Code Playgroud)

html javascript html-table

-5
推荐指数
1
解决办法
8010
查看次数

从HTML表中提取数据的Perl脚本

我需要一个Perl脚本来解析一个包含2列的简单HTML表.

该表包括:第1列用户名和第2列他/她在线的时间.

我需要将数据作为:名称Time_online

我尝试过HTML :: TreeBuilderHTML :: Parser但没有结果.

我想以某种方式获取和操纵这些数据.谢谢!

<h1>Users currently online</h1>
<table class="list-table" cellpadding="3" cellspacing="1" summary="Data for online_users">
<thead>
<tr class="list-header">
<th class="list-table" id="online_users_name">
User name
</th>
<th class="list-table" align="right" id="online_users_online_time_pretty">
Online time        
</th>
    </tr>
    </thead>  

    <tbody>
              <tr class="odd"> 
              <td class="list-table" headers="online_users_name">
                <a href="Link">Jack Boauldwin</a>
              </td>

              <td class="list-table" align="right" headers="online_users_online_time_pretty">
                11 minutes
              </td>
            </tr>
        <tr class="even">  

              <td class="list-table" headers="online_users_name">
                <a href="Link">Sarah James</a>
              </td>

              <td class="list-table" align="right" headers="online_users_online_time_pretty">
                1 minutes
              </td>            
          </tr>

              <tr class="odd">


              <td class="list-table" …
Run Code Online (Sandbox Code Playgroud)

html perl html-table html-parsing

-6
推荐指数
1
解决办法
1201
查看次数