Question

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

    <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>

它提供了这样的东西：

现在我想测试一个未经检查的复选框是否在未添加空格的单元格的同一表格行中：

<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

您可以执行以下操作（代码中的注释）：

＆＃13;

$('.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
    }
  }
})

＆＃13;

<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>

＆＃13;

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

1 个答案: