问使用jQuery清空除特定元素之外的所有内容的最佳方法？
EN

Stack Overflow用户

提问于 2019-06-05 13:13:45

回答 2查看 70关注 0票数 0

考虑：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>Foo</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked">1 </span>
          <span><input type="checkbox" disabled="disabled"> 2</span>
          <span><input type="checkbox" disabled="disabled"> 3</span>
        </p>
      </td>
    </tr>
    <tr>
      <td>Bar</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked"> A</span>
          <input type="checkbox" disabled="disabled"> B
        </p>
      </td>
  </tbody>
</table>

使用jQuery，如何只保留具有属性checked的input的？基本上，最后，我只需要以下HTML：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>Foo</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked">1 </span>
        </p>
      </td>
    </tr>
    <tr>
      <td>Bar</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked"> A</span>
        </p>
      </td>
  </tbody>
</table>

请注意，出于某种原因，B for Bar无意包装在上(我没有编写)。另外，假设检查的输入始终在中。

最后，我需要一个没有(匿名)函数的单行jQuery命令，因为我使用的工具只支持一行jQuery语句。我最终只想提取这个HTML的.text()，因此我想删除其各自输入未被选中的文本。

我得到的最接近的是$("table").find("p:has(input)").contents().not("span:has(input:not(:checked))").remove().end().html() (不起作用)

jquery

jquery-selectors

语音识别特惠，低至14.9元！

提供业界非常具有性价比的语音识别服务，超高识别准确率，适用多场景

回答 2

Stack Overflow用户

发布于 2019-06-05 13:27:24

一号线？？那可能是不可能的，

$(document).ready(function(){

  $("table tr td p").each(function(){
  
    var html = "";
    $(this).find('span').each(function(){
      if($(this).has('input[checked="checked"]').length){
        html += '<span>'+$(this).html()+'</span>';
      }
    });
    $(this).html(html);
    
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>Foo</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked">1 </span>
          <span><input type="checkbox" disabled="disabled"> 2</span>
          <span><input type="checkbox" disabled="disabled"> 3</span>
        </p>
      </td>
    </tr>
    <tr>
      <td>Bar</td>
      <td>
        <p>
          <span><input type="checkbox" disabled="disabled" checked="checked"> A</span>
          <input type="checkbox" disabled="disabled"> B
        </p>
      </td>
  </tbody>
</table>

票数 0

Stack Overflow用户

发布于 2019-06-05 13:32:54

一个更新的答案，用于尝试和处理未包装在中的输入。

// Finds all checked input
var $targets = $('body').find('input:checked');

// Loop over each input
$($targets).each(function(){

    // If the parent isn't a span, then false
    var parent_span = ($(this).parent().is('span')) ? $(this).parent() : false;

    // If parent span is not false, empty the closest p and append the span, otherwise remove spans from parent p
    (parent_span !== false) ? $(this).closest('p').empty().append(parent_span) : $(this).closest('p').find('span').remove();

})