Question

我想只在td的HTML为空（例如td with contenteditable='true'），使用jQuery时才调用函数。注意您应该不考虑换行符和空格。我怎么能只做

<table>
  <tbody>
    <tr>
      <td contenteditable="true">
        <br type="_moz"></br>
      </td>
      <td contenteditable="false">2</td>
      <td contenteditable="false">3</td>
    </tr>
    <tr>
      <td contenteditable="false">4</td>
      <td contenteditable="true">
        <br type="_moz"></br>
      </td>
      <td contenteditable="true">
        <br type="_moz"></br>
      </td>
    </tr>
  </tbody>
</table>

以下都不起作用：

if ($('#element').is(':empty')){
  //do something
}

或

if($.trim($("selector").html())=='')

Answer 1

使用 filter() 方法

$('td').filter(function() {
  return $.trim($(this).text()).length == 0;
})

＆＃13;

$('td').filter(function() {
  return $.trim($(this).text()).length == 0;
}).css('border', '1px solid red')

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td contenteditable="true">
        <br type="_moz">
      </td>
      <td contenteditable="false">2</td>
      <td contenteditable="false">3</td>
    </tr>
    <tr>
      <td contenteditable="false">4</td>
      <td contenteditable="true">
        <br type="_moz">
      </td>
      <td contenteditable="true">
        <br type="_moz">
      </td>
    </tr>
  </tbody>
</table>

＆＃13;

Answer 2

再一次..

$('td').each(function() {
  if(!$(this).text().trim().length){
      $(this).css('border', '1px solid black');
  }
});

$('td').each(function() {
  if(!$(this).text().trim().length){
      $(this).css('border', '1px solid black');
  }
});

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <table>
      <tbody>
        <tr>
          <td contenteditable="true">
            <br type="_moz">
          </td>
          <td contenteditable="false">2</td>
          <td contenteditable="false">3</td>
        </tr>
        <tr>
          <td contenteditable="false">4</td>
          <td contenteditable="true">
            <br type="_moz">
          </td>
          <td contenteditable="true">
            <br type="_moz">
          </td>
        </tr>
      </tbody>
    </table>

如何使用jquery检查元素是否为空？

2 个答案: