使用jquery选择表单过滤器

我已经为可用工作列表创建了一个页面。 页面中有两个功能：寻呼机和选择表单过滤器。 我需要一些帮助选择表单过滤器如何工作。 以下是该页面的屏幕截图：

该页面由wordpress提供支持，每个职位都是通过职位类型创建的。请参见下面的我的代码：

<?php
    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
    $args = array(
        'paged' => $paged,
        'posts_per_page' => 3,
        'category_name' => 'job',
        'orderby' => 'post_date',
        'order' => 'DESC',
        'post_type' => 'post',
        'post_status' => 'publish',
        'suppress_filters' => true);

    $job = new WP_Query($args);
?>

<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
    <select class="filterby">
        <option>Search Location</option>
        <option value="Perth">Perth</option>
        <option value="Melbourne">Melbourne</option>
        <option value="South-Perth">South Perth</option>
    </select>
</form>
<div class="inline-block vertical-middle s-btn"> 
    <input type="submit"   value="Search" name="search">
</div>    

<?php while ($job->have_posts()) : $job->the_post();?>
    <section id="content-area" class="job clearfix">
        <div class="container">
            Job Details here
        </div>
    </section>
<?php endwhile;?>

<div class="paging">
    <?php 
        $args = array(
            'base' => @add_query_arg('paged','%#%'),
            'format' => '?paged=%#%',
            'current' => max( 1, get_query_var('paged') ),
            'prev_text'    => __('Previous'),
            'next_text'    => __('Next'),
            'total' => $job->max_num_pages);
        echo paginate_links( $args );  
    ?>
</div>

您可以尝试
.change（）
jquery方法，因为它适用于这里的示例
（观看演示）


然后尝试类似于
$（“a”）.attr（“href”，valueVariable）的方法

attr还可以用作
$（“元素”）.attr（“id”，valueVariable）

valueVariable具有页面中元素的id


提示
在普通HTML上使用以下内容时：

<a href="#tips">Visit the Useful Tips Section</a>



这将转到同一页面中的id元素

请对结果进行评论并投票。
这里有一个小提琴，可以用select的事件
change（）
进行过滤


$（文档）.ready（函数（）{
$（'.filter'）.change（函数（）{
$（'.filterable'）。每个（函数（）{
if（$（this）.data（'ref'）！=$（'.filter'）.val（）&&&$（'.filter'）.val（）！=-1）{
$（this.hide（）；
}否则{
$（this.show（）；
}
});
});
});

没有选择
城市1
城市2
城市3
城市4
这是城市一号的模拟潜水艇

这是第二城的模拟潜水艇

这是第三城的模拟潜水艇

这是第三城的模拟潜水艇

这是第二城的模拟潜水艇

这是第二城的模拟潜水艇

这是第四城的模拟潜水艇

这是第四城的模拟潜水艇

您还知道过滤器是如何使用PHP或wordpress函数工作的吗？谢谢。啊，好的：）顺便说一句，我喜欢过滤器在我点击提交按钮后工作，我尝试了这个，但它不能正常工作。我在输入按钮上添加了一个id=“filter job”<代码>$（文档）.ready（function（）{$（'.'filter job'）。单击（function（）{$（'.filter'）。更改（function（）{$（'.filterable'）。每个（function（）{if（$）（this）.data（'ref'）！=$（'.filter'）.val（）&&（'.filter'）.val（）！=-1{$（this）。hide（）；}否则{$（this）。show（）;                }            });            });          });        });