Question

我有一个下载菜单，该文件正在从Wordpress管理员手中取出。

$agg = "
<div class='select-aggr'>
    <h2 class='select-aggr-h'>
        I want to read about
    </h2>
        <select class='mounth'>
            <option value='hide'>
            <a href='$url' class='aggregator-option selected' data-name='everythings' data-filter='category-anything'>everything</a>
            </option>";
$query = "SELECT name FROM wp_terms t
    INNER JOIN wp_term_taxonomy tx ON t.term_id = tx.term_id
    WHERE t.term_id in ($cats)
    AND tx.parent = 0
    AND tx.taxonomy in ($tax)";
$results = $wpdb->get_results ($query);

foreach ($results as $cat) {
    $name = $cat->name;
    if (strtolower($name) == "featured") {
        continue;
    }
    $agg .= '<option value="' .$name.'" >
        <a href="' .$url . '?cat=' . strtolower($name) .'" class="aggregator-option" data-name="'.$name.'" data-filter="category-'.$name.'">'.$name.'</a>
    </option>';
}
$agg .= "
    </select>
</div>";

这个想法是在$ agg里面，选项标签可以获得从wordpress中提取的任何href和信息。

现在我为自定义下拉菜单创建了一个jQuery函数。因此，它不是选项而是使用LI创建UL，对应于被拉出的选项。这样我就可以轻松地为他们设置样式，然后创建自定义箭头等。

现在如何使用正确的信息在这些列表项中添加标记？出于某种原因，我尝试过的一些组合不起作用。

以下是我需要帮助的jQuery函数的代码

$('.mounth').each(function(){
                var $this = $(this), numberOfOptions = $(this).children('option').length;

                $this.addClass('select-hidden');
                $this.wrap('<div class="select"></div>');
                $this.after('<div class="select-styled"></div>');

                    var $styledSelect = $this.next('div.select-styled');
                $styledSelect.text($this.children('option').eq(0).text());

                    var $list = $('<ul />', {
                    'class': 'select-options'
                }).insertAfter($styledSelect);

                    for (var i = 0; i < numberOfOptions; i++) {
                    $('<li />', {
                        text: $this.children('option').eq(i).text(),
                        rel: $this.children('option').eq(i).val()
                    }).appendTo($list);
                }

                    var $listItems = $list.children('li');

                    $styledSelect.click(function(e) {
                            e.stopPropagation();
                            $('div.select-styled.active').not(this).each(function(){
                                    $(this).removeClass('active').next('ul.select-options').hide();
                            });
                            $(this).toggleClass('active').next('ul.select-options').toggle();
                    });

                    $listItems.click(function(e) {
                    e.stopPropagation();
                    $styledSelect.text($(this).text()).removeClass('active');
                    $this.val($(this).attr('rel'));
                    $list.hide();
                    //console.log($this.val());
                });

                    $(document).click(function() {
                    $styledSelect.removeClass('active');
                    $list.hide();
                });
                });

自定义选择菜单问题（jquery和php）

0 个答案: