Question

我在尝试修复我正在开发的网站上的类别下载时遇到了一些问题。基本上一个下拉过滤器具有“按位置排序”，第二个是“按价格排序”第一个正常工作，即“按位置排序”，但第二个没有。它正在加载所有帖子而不是正确过滤。

这是链接 -

http://digitalspin.ph/federalland/?page_id=23

这是我的代码

HTML -

<div class="filter_container">
        <?php wp_dropdown_categories( $args_cat1 ); ?> 
</div>

<div class="filter_container">
        <?php wp_dropdown_categories( $args_cat2 ); ?> 
</div>

JS -

<!--DROPDOWN SORT CATEGORY 1 -->
<script type="text/javascript">
var dropdown = document.getElementById("cat1");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');
?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
</script>


<!--DROPDOWN SORT CATEGORY 2-->
<script type="text/javascript">
var dropdown = document.getElementById("cat2");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');
?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
</script>

的functions.php

//LOCATION FILTER

$args_cat2 = array(
'show_option_all'    => '',
'show_option_none'   => '',
'orderby'            => 'ID', 
'order'              => 'ASC',
'show_count'         => 0,
'hide_empty'         => 1, 
'child_of'           => 0,
'exclude'            => '1,2,3,4,32,33,34,35,36,37',
'echo'               => 1,
'selected'           => 0,
'hierarchical'       => 0, 
'name'               => 'cat2',
'id'                 => 'cat2',
'class'              => 'postform',
'depth'              => 0,
'tab_index'          => 0,
'taxonomy'           => 'category',
'hide_if_empty'      => false,
'walker'             => ''
);

//PRICE FILTER

$args_cat1 = array(
'show_option_all'    => '',
'show_option_none'   => '',
'orderby'            => 'ID', 
'order'              => 'ASC',
'show_count'         => 0,
'hide_empty'         => 1, 
'child_of'           => 0,
'exclude'            => '1,2,3,4,23,24,25,26,27,28,29,30,31',
'echo'               => 1,
'selected'           => 0,
'hierarchical'       => 0, 
'name'               => 'cat1',
'id'                 => 'cat1',
'class'              => 'postform',
'depth'              => 0,
'tab_index'          => 0,
'taxonomy'           => 'category',
'hide_if_empty'      => false,
'walker'             => ''
);

以下是来自firebug-

的javascript错误

TypeError: dropdown is null
dropdown.onchange = onCatChange;

每当我在“按价格排序”中选择一个类别时，它会显示“按位置排序”的所有帖子，即类别ID 23

Answer 1

主要问题是你认为你的2个javascripts是在不同的环境中执行的，而不是。它们在相同的上下文中执行，所以

<script type="text/javascript">
var dropdown = document.getElementById("cat1");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
var dropdown = document.getElementById("cat2");
function onCatChange() {
    if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
    }
}
dropdown.onchange = onCatChange;
</script>

会产生完全相同的结果。您需要更改某些变量和函数的名称，以便它们不会发生碰撞或执行以下操作：

document.getElementById("cat1").onChange = function(){
    if ( this.options[this.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');?>/?cat="+this.options[this.selectedIndex].value;
    }
}

document.getElementById("cat2").onChange = function(){
    if ( this.options[this.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');?>/?cat="+this.options[this.selectedIndex].value;
    }
}

或者甚至更好

var catChanger = function(){
    if ( this.options[this.selectedIndex].value > 0 ) {
        location.href = "<?php echo get_option('home');?>/?cat="+this.options[this.selectedIndex].value;
    }
}

document.getElementById("cat1").onChange = catChanger;    
document.getElementById("cat2").onChange = catChanger;

尝试修复多个类别下拉列表

1 个答案: