如何知道标签内容有空格？

Question

我在特定条件下 table 单元格的内容前放置了空格：

    <c:forEach items="${menus}" var="hash_map_menu">
        <c:if test="${hash_map_menu.key == groupe_menu.gmnu_code}">
            <c:forEach items="${hash_map_menu.value}" var="menu" varStatus="iterator">
                <c:set var="bgcolor" value="#f9f9f9"/>
                <c:set var="checked" value=""/>
                <c:set var="indentation" value=""/>
                <c:forEach items="${role_menus}" var="role_menu">
                    <c:if test="${role_menu.menu_id == menu.menu_id}">
                        <c:set var="checked" value="checked"/>
                    </c:if>
                </c:forEach>
                <table class="table">
                    <tbody>
                        <c:if test="${iterator.index % 2 == 0}">
                            <c:set var="bgcolor" value="white"/>
                        </c:if>
                        <c:if test="${menu.menu_bouton == 1}">
                            <c:forEach begin="0" end="${menu.depth}">
                                <c:set var="indentation" value="${indentation}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" />
                            </c:forEach>
                        </c:if>
                        <tr style="background-color:${bgcolor};">
                            <td id="menulib_${menu.menu_id}">${indentation}${menu.menu_navigation}</td>
                            <td width="5%" align="center"><label><input type="checkbox" class="minimal" id="${menu.menu_id}" name="${menu.menu_id}" value="${menu.menu_id}" ${checked} /></label></td>
                        </tr>
                    </tbody>
                </table>
             </c:forEach>
         </c:if>
     </c:forEach>

它给出了这样的东西：

现在我想测试未选中的复选框是否位于未添加空格的单元格的同一 table 行中：

<script type="text/javascript">

    $(function() {

        $(":checkbox").on("ifUnchecked", function() { // iCheck callback
            var cellContent = $("td[id='menulib_"+$(this).attr('id')+"']").html();
            if (cellContent == $.trim(cellContent)) {
                alert("unchecked a parent checkbox");
            } else {
                alert("unchecked a child checkbox");
            }
        });

    });

</script>

在运行时，即使我取消选中对应于包含空格的单元格的行的复选框，我也会收到警报 unchecked a parent checkbox！那么如何知道一个元素的内容有空格呢？

Answer 1

你可以这样做（代码中的注释）：

$('.minimal').on('change', function() { // bind change event to checkboxes
  var checkbox = $(this);
  if (!checkbox.is(':checked')) {  // run the following if the checkbox is unchecked
    var firstCell = checkbox.closest('td').prev();  // get the first sibling cell (this assumes your checkbox is always the second cell)
    
    if (firstCell.html().startsWith('&nbsp;')) { // check if the html starts with a non breaking space
      firstCell.css('color', 'red');  // do your stuff here
    }
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
  <tbody>
    <tr style="background-color:${bgcolor};">
      <td id="menulib_${menu.menu_id}">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${menu.menu_navigation}</td>
      <td width="5%" align="center">
        <label>
          <input type="checkbox" class="minimal" id="${menu.menu_id}" name="${menu.menu_id}" value="${menu.menu_id}" ${checked} />
        </label>
      </td>
    </tr>
    <tr style="background-color:${bgcolor};">
      <td id="menulib_${menu.menu_id}">${menu.menu_navigation1}</td>
      <td width="5%" align="center">
        <label>
          <input type="checkbox" class="minimal" id="${menu.menu_id1}" name="${menu.menu_id1}" value="${menu.menu_id}" ${checked} />
        </label>
      </td>
    </tr>
  </tbody>
</table>

如何知道标签内容有空格？

How to know that a tag content has spaces?

html

jquery

jsp

jstl