0

我遇到了一个主题修改，我想jquery.ui.autocomplete用父子类别输出来更改 wordpress 下拉列表的平面类别输出。

因此，我想定义新属性category: {$cat->parent}并在渲染列表中调用它而不是 item.label（请参阅 参考资料.append( "<a>" + item.category + "</a>" )）。

如果这可行，我可以为父类别提供与其他所有类别不同的​​样式。但我无法输出名称而不是 ID。

$cat->parent抛出对应于类别 parent-cat 的 id 列表（当没有父级时给出 ）。我怎样才能扔掉父母的名字呢？

另一种实现我需要的方法是获取 parent-cat-ids（如下例所示），然后定义输出样式，如：

  • 如果 cat 的 parent-cat = 0，则应用此样式
  • 如果 cat 的 parent-cat = something-else，则应用另一种样式

谁能指出我正确的方向？我不是一个好的程序员。我几乎没有找到正确的位置来编辑这个列表输出。如果这里有人可以帮助我，那就太好了。我将在主题论坛和此处（如果受到赞赏）发布修改教程，以尽可能多地回馈社区。

jQuery(document).ready(function($) {

                var categories = [
                {foreach $categories as $cat}
                    { category: {$cat->parent}, value: {$cat->term_id}, label: {$cat->name} }{if !($iterator->last)},{/if}
                {/foreach}
                ];
                var locations = [
                {foreach $locations as $loc}
                    { value: {$loc->term_id}, label: {$loc->name} }{if !($iterator->last)},{/if}
                {/foreach}
                ];
                var catInput = $( "#dir-searchinput-category" ),
                    catInputID = $( "#dir-searchinput-category-id" ),
                    locInput = $( "#dir-searchinput-location" ),
                    locInputID = $( "#dir-searchinput-location-id" );

                if(catInput.length > 0) {
                    catInput.autocomplete({
                        minLength: 0,
                        source: categories,
                        focus: function( event, ui ) {
                            catInput.val( ui.item.label.replace(/&amp;/g, "&") );
                            return false;
                        },
                        select: function( event, ui ) {
                            catInput.val( ui.item.label.replace(/&amp;/g, "&") );
                            catInputID.val( ui.item.value );
                            return false;
                        }
                    }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                        return $( "<li>" )
                            .data( "item.autocomplete", item )
                            .append( "<a>" + item.category + "</a>" )
                            .appendTo( ul );
                    };
                    var catList = catInput.autocomplete( "widget" );
                    catList.niceScroll({ autohidemode: false });

                    catInput.click(function(){
                        catInput.val('');
                        catInputID.val('0');
                        catInput.autocomplete( "search", "" );
                    });
                }
4

1 回答 1

0

我设法将另一种样式（仅用于测试目的的内联 css！）附加到每个父类别项。如果我现在能够按父级-> 子级层次对项目进行排序，那么就会有我需要的东西......

有人可以给我一个提示如何做到这一点吗？这是当前代码：

jQuery(文档).ready(函数($) {

            var categories = [
            {foreach $categories as $cat}
                { category: {$cat->parent}, value: {$cat->term_id}, label: {$cat->name} }{if !($iterator->last)},{/if}
            {/foreach}
            ];
            var locations = [
            {foreach $locations as $loc}
                { value: {$loc->term_id}, label: {$loc->name} }{if !($iterator->last)},{/if}
            {/foreach}
            ];
            var catInput = $( "#dir-searchinput-category" ),
                catInputID = $( "#dir-searchinput-category-id" ),
                locInput = $( "#dir-searchinput-location" ),
                locInputID = $( "#dir-searchinput-location-id" );

            if(catInput.length > 0) {
                catInput.autocomplete({
                    minLength: 0,
                    source: categories,
                    focus: function( event, ui ) {
                        catInput.val( ui.item.label.replace(/&amp;/g, "&") );
                        return false;
                    },
                    select: function( event, ui ) {
                        catInput.val( ui.item.label.replace(/&amp;/g, "&") );
                        catInputID.val( ui.item.value );
                        return false;
                    }
                }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                    if ( item.category != 0 ) {
                            return $( "<li>" )
                            .data( "item.autocomplete", item )
                            .append( "<a>" + item.label + "</a>" )
                            .appendTo( ul );       
                            }
                    else {
                    return $( "<li>" )
                    .data( "item.autocomplete", item )
                    .append( "<a style='font-weight:bold;'>" + item.label + "</a>" )
                    .appendTo( ul );       
                    }
                };
                var catList = catInput.autocomplete( "widget" );
                catList.niceScroll({ autohidemode: false });

                catInput.click(function(){
                    catInput.val('');
                    catInputID.val('0');
                    catInput.autocomplete( "search", "" );
                });
            }
于 2013-11-01T18:13:03.440 回答