Question

我有以下两个由PHP生成的HTML。

我想将第二个附加到第一个表td。如果有事件，我想将class =“date_has_event”添加到td。每个事件都有数字，即div id中的日期。

我正在使用jquery，但我不确定。有谁能告诉我如何处理这个问题？

HTML

<tr>
<td>17</td><td><div class="highlight">18</div></td><td>19</td><td>20</td>
<td>21</td><td>22</td><td>23</td>
</tr>

DIV我想附加到上面的HTML。

- 更新 -

以下内容将由PHP / MYSQL动态生成。这些是事件列表。第17个div必须附加到td是17和19 div到td 19等。

<div id ="17" class="events">
     <ul style="opacity: 0; top:
20px; left: -76px; display: none; bottom: -202px;">
       <li><a href="index.php/admin
/calendar/edit/1">
       <span class="title">17th event 1</span>
       <span class="desc">event 1 of 17th</span></a>
       </li>
       <li><a href="index.php/admin/calendar/edit/4">
       <span class="title">17th event 2</span>
       <span class="desc">event 2 of 17th</span></a>
       </li>
       <li><a href="index.php/admin/calendar/edit/13">
       <span class="title">make pancake with
emile</span>
       <span class="desc">mix flour, water and raindrops with love</span></a>
       </li>
    </ul>
  </div>


    <div id="19" class="events">
   <ul style="opacity: 0;">
      <li><a href="index.php/admin/calendar/edit/2">
      <span class="title">19th event 1</span>
      <span class="desc">id 2 change</span>
</a></li>
      <li><a href="index.php/admin/calendar/edit/5">
      <span class="title">19th event 2</span>
      <span class="desc">event 2 of 19th</span></a>
      </li>
      <li><a href="index.php/admin/calendar/edit/6">
      <span class="title">19th event 3</span>
      <span class="desc">event 3 of 19th</span></a>
      </li>
    </ul>
 </div>
    ...
    ...

我想要的最终输出。

<tr>
   <td class="date_has_event"> 17<div class="events">
     <ul style="opacity: 0; top:
20px; left: -76px; display: none; bottom: -202px;">
       <li><a href="index.php/admin
/calendar/edit/1">
       <span class="title">17th event 1</span>
       <span class="desc">event 1 of 17th</span></a>
       </li>
       <li><a href="index.php/admin/calendar/edit/4">
       <span class="title">17th event 2</span>
       <span class="desc">event 2 of 17th</span></a>
       </li>
       <li><a href="index.php/admin/calendar/edit/13">
       <span class="title">make pancake with
emile</span>
       <span class="desc">mix flour, water and raindrops with love</span></a>
       </li>
    </ul>
  </div>
</td>
<td id="today"> 18</td><td class="date_has_event"> 19<div 
class="events">
   <ul style="opacity: 0;">
      <li><a href="index.php/admin/calendar
/edit/2">
      <span class="title">19th event 1</span>
      <span class="desc">id 2 change</span>
</a></li>
      <li><a href="index.php/admin/calendar/edit/5">
      <span class="title">19th event 2</span>
      <span class="desc">event 2 of 19th</span></a>
      </li>
      <li><a href="index.php/admin/calendar/edit/6">
      <span class="title">19th event 3</span>
      <span class="desc">event 3 of 19th</span></a>
      </li>
    </ul>
 </div>
</td>
<td> 20</td><td> 21</td><td> 22</td><td> 
23</td></tr>

Answer 1

考虑您的td单元格有一个类my_td。也许就像：

$(document).ready(function(){
   $('.my_td').each(function(){
      var div_id = $(this).text();
      var matched_div = $('div#'+div_id);
      if(matched_div.children('ul li').length){
        $(this).addClass = 'date_has_event';
        $(this).append(matched_div)
      }
   });
});

未经测试，但我只想表明如何解决问题的基本想法。

Answer 2

尝试这样的事情：

if ($('div[@id]') == $(td).html())
{
    $('somediv').html('<div>whatever</div>')
    $('somediv').addClass('classname');
}

在上面的代码中，您应该指定正确的div和td标识符。

Answer 3

尝试：

$('#mytable td').each (function ()
{
    var cell = $(this), div = $('#' + cell.text());
    if (div.length)
        cell
        .addClass ('date_has_events')
        .append (div);
});

将#mytable替换为您的表格ID

如何附加div并添加class，其中div id与td值与jquery相同？

3 个答案: