jquery-chosen - jquery 选择的多级层次结构

Question

我正在使用 jquery 选择的插件。http://harvesthq.github.com/chosen/ 在选择的 jquery 中可以显示下拉菜单

• - 选择 -
• 主手册1
  • 菜单1
  • 菜单2
• 主手册2
  • 菜单3
  • 菜单4

但我想显示下拉菜单

• - 选择 -
• 主菜单1
  • 子手册1
    • 菜单1
    • 菜单2
• 主菜单2
  • 子手册2
    • 菜单1
    • 菜单2

可能吗？请帮帮我。

Answer 1

要从选择的标签中删除空格 ( )，您可以修改 jq-Chosen 以修剪它们。

从第 173 行（选择 1.4.2）开始的函数choice_label中替换item.html为：item.html.replace( / /g,'' )

AbstractChosen.prototype.choice_label = function(item) {

  if (this.include_group_label_in_selected && (item.group_label != null)) {
    return "<b class='group-name'>" + item.group_label + "</b>" + item.html.replace( /&nbsp;/g,'' );
  } else {
    return item.html.replace( /&nbsp;/g,'' );
  }
};

Answer 2

我很确定它不是，除非你以某种方式破解它。我最近自己需要这个，但得出的结论是没有支持。他们的示例页面上没有任何内容表明这是可能的，并且该段落

因为 selected 替换了普通的 html 选择字段，所以您不需要做任何特别的事情来使其适用于没有 JavaScript 的浏览器。您也不需要在后端做任何特殊的事情来处理数据——表单字段仍然可以正常提交。

似乎表明 Chosen 仅增强了本机选择框的用户体验，并没有真正增加它们的任何复杂性。

Answer 3

是的，这是可能的，但我仍然处于某种挣扎之中。

            <?php
            $args = array(
                'type'          => 'post',
                'orderby'       => 'term_group',
                'hide_empty'    => 0,
                'hierarchical'  => 0,
                'parent'        => 0,
                'exclude_tree'  => '49,1,63'
            );
            $topcats = get_categories( $args );
            ?>

            <select class="chosen-select" multiple>
                <?php
                    foreach ($topcats as $a) {
                        echo "<optgroup label='$a->name'>";
                        $args = array(
                            'child_of'       => $a->cat_ID,
                            'hide_empty'   => false
                        );
                        $children = get_terms('category', $args);
                        foreach ($children as $child) {
                            $cat = get_category($child->term_id);
                            $lvl = get_level($cat);
                            $space = "";
                            for ($i = 1; $i < $lvl; $i++) { $space .= "&nbsp;&nbsp;"; }
                            echo "<option>$space $child->name</option>";
                        }
                        echo "</optgouop>";
                    }
                ?>
            </select>

我在 Wordpress 中工作，所以我加载了类别，并使用了我在互联网上找到的 get level hack（我真的很抱歉，但不记得在哪里，所以作者先生，请原谅我）

这是黑客：

function get_level($category, $level = 0)
{
    if ($category->category_parent == 0) {
        return $level;
    } else {
        $level++;
        $category = get_category($category->category_parent);
        return get_level($category, $level);
    }
}

我仍然无法弄清楚的真正问题是如何从单选中删除这些空格。如果您使用此代码并选择一个选项，则空格将转移到多个选择框的选择行中。