由于 Wicket 框架插入的结构元素而出现问题的 JQuery 脚本

Question

我在使用 Wicket 和 JQuery 时遇到问题。我正在构建一棵具有 ul/li 结构的树。但是，Wicket 插入了我无法摆脱的自己的元素，例如对于这样的结构：

<ul>
    <li><input type="checkbox"/></li>
    <li>
      <ul>
        <li><input type="checkbox"/></li>
        <li><input type="checkbox"/></li>
      </ul>
<ul>

你最终会得到类似的东西：

<ul>
    <span><li><input type="checkbox"/></li></span>
    <span><li>
      <wicket:panel><ul>
        <span><li><input type="checkbox"/></li></span>
        <span><li><input type="checkbox"/></li></span>
      </ul></wicket:panel>
     </span>
<ul>

所以，第二个代码有一些垃圾，这会导致 jquery 出现一些问题，例如，如果我在第一个示例的某些元素上调用 children() 和兄弟姐妹() 方法，我将得到一致的结果，但是在第二个示例中，要跟上 Wicket 框架导致的“结构异常”（wicket:panel 和 span）变得非常复杂。

我想要做的就是能够设置不确定的复选框值，我找到了一个不错的 jquery 脚本：

http://css-tricks.com/indeterminate-checkboxes/

但是，我找不到让脚本“忽略”Wicket 引入的元素的方法，或者调整脚本以便找到它需要验证的复选框的方法。

解决此类问题的干净方法是什么？我将遇到更多类似的情况，其中 wicket 元素结构将导致已在示例页面上测试过的 jquery 脚本不再工作......

Answer 1

使用 Wicket id 显示您的标记文件。 根据您显示的输出，我猜想：

1. <wicket:panel> 在输出 html 中 - 要摆脱这个使用过程 setStripWicketTags(true) http://ci.apache.org/projects/wicket/apidocs/6.x/org/apache/wicket/settings/IMarkupSettings.html#setStripComments%28boolean%29

2. 为了摆脱输出 html 中的跨度，我猜您将检票口 ID 附加到跨度元素。您不必使用<span> 元素，您可以直接将检票口ID 添加到<li> 元素：<li wicket:id="blah"></li>。最后，在附加到<span> 的检票口 ID 上，您可以致电setRenderBodyOnly(true)。但是我不推荐这个，特别是如果你使用 ajax。我不知道这是否有帮助 - 我需要查看原始标记文件。

Answer 2

可以使用JQuery find，因为据说：

.children() 方法与 .find() 的不同之处仅在于 .children() 在 .find() 可以遍历时沿 DOM 树向下移动一层 向下多个级别选择后代元素（孙子， 等等）。

您还可以在嵌套的 li 元素上放置一些类选择器或 id 以便于搜索。