0

我的表设计如下：

  <table>
      <thead>
         <tr><th class='fc-id1 ui-widget-header'>09:00</th></tr>
         <tr><th class='fc-id2 ui-widget-header'>09:30</th></tr>
         <tr><th class='fc-id3 ui-widget-header'>10:00</th></tr>
      </thead>
      <tbody>
          <tr id='res1'><td class='fc-id4 ui-widget-content fc-resource1 '><div class=day-content'></div></td></tr>
          <tr id='res2'><td class='fc-id5 ui-widget-content fc-resource2 '><div class=day-content'></div></td></tr>
          <tr id='res3'><td class='fc-id6 ui-widget-content fc-resource3 '><div class=day-content'></div></td></tr>
      </tbody>
  </table>

现在在页面加载上，我想将 th 的值与当前时间进行比较。我有唯一的 resourceid 可以与 tr id 和 td 类进行比较。

我正在尝试使用此代码。但它不工作。它给出空值。

  var td = $('.fc-resource'+ id); // this id will be the unique id coming from ajax.
  var th = td.closest('tbody').prev('thead').find('> tr > th:eq(' + td.index() + ')').html();
  alert(th);

谁能帮帮我？

4

5 回答 5

3

你为什么不直接使用

  var td = $('.fc-resource'+ id); 
  var head = td.parent().parent().parent().find("thead");
  var th = head.find("th:eq("+td.index()+")");
  alert(th.text());
于 2013-05-14T05:53:38.277 回答
1

只需对您的代码稍作改动，它应该可以工作：

var td = $('.fc-resource'+ id); // this id will be the unique id coming from ajax.
var th = td.closest('tbody').prev('thead').find('> tr > th:eq(' + td.closest('tr').index() + ')').html();
alert(th);

.closest('tr')之前请注意.index()

在这里http://jsfiddle.net/RDZFU/你可以看到它适用于你提供的 html 代码。

于 2013-05-14T06:08:21.067 回答
1

Working FIDDLE Demo

你index对你的td. 你必须得到index它的父母tr。看：

var id = 2;
var td = $('.fc-resource' + id);
var tr = td.closest('tr');
var index = tr.index();
var th = td.closest('tbody').prev('thead').find('> tr > th:eq(' + index + ')').html();
alert(th);

也不要忘记检查FIDDLE 演示。

于 2013-05-14T05:55:13.583 回答
0

将该eq()方法与从 AJAX 请求返回的内容一起使用。id为您的表添加一个特殊性：

var id = 1; //from AJAX
var th = $('#myTable th').eq($('.fc-resource'+id).index()).html();
alert(th);

此外，您的标记有点混乱。你忘了关闭一些东西：

<table id="myTable">
    <thead>
        <tr>
            <th class='fc-id1 ui-widget-header'>09:00</th>
        </tr>
        <tr>
            <th class='fc-id2 ui-widget-header'>09:30</th>
        </tr>
        <tr>
            <th class='fc-id3 ui-widget-header'>10:00</th>
        </tr>
    </thead>
    <tbody>
        <tr id='res1'>
            <td class='fc-id4 ui-widget-content fc-resource1'>
                <div class='day-content '></div>
            </td>
        </tr>
        <tr id='res2 '>
            <td class='fc-id5 ui-widget-content fc-resource2 '>
                <div class='day-content'></div>
            </td>
        </tr>
        <tr id='res3'>
            <td class='fc-id6 ui-widget-content fc-resource3'>
                <div class='day-content'></div>
            </td>
        </tr>
    </tbody>
</table>

jsFiddle

于 2013-05-14T05:42:25.963 回答
0

尝试

$('th').each(function () {
    var $this = $(this);
    var d = new Date();
    var text = $this.text();
    var parts = text.match(/(\d+):(\d+)/);
    if (parseInt(parts[1], 10) == d.getHours() && parseInt(parts[2], 10) == d.getMinutes()) {
        $this.addClass('now');
    }
});

演示：小提琴

于 2013-05-14T05:48:52.537 回答