Question

在下拉选择框中选择拼字法后，我有一些代码行可以按AJAX过滤wordpress类别。但是您必须按下一个按钮才能开始该过程。我想不用按钮就可以拥有它。

我认为在第一行中将“提交”更改为“更改”即可完成工作。但这行不通。因此，我的问题是：从下拉列表中选择类别后，如何避免该按钮并使它直接运行？

带有按钮的下拉列表：

<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
    <?php
        if( $terms = get_terms( array( 'taxonomy' => 'category', 
                                        'orderby' => 'name',
                                        'include'          => array(32, 33, 34, 35, 36, 41 ) ) ) ) : 

            echo '<select name="categoryfilter"><option value="">Categorias</option>';
            foreach ( $terms as $term ) :
                echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; 
            endforeach;
            echo '</select>';
        endif;
    ?>


    <button class="emed_go">GO!</button>
    <input type="hidden" name="action" value="myfilter">
</form>
<div id="response"></div>

这里是jQuery：

$('#filter').submit(function(){
        var filter = $('#filter');
        $.ajax({
            url:filter.attr('action'),
            data:filter.serialize(), 
            type:filter.attr('method'), 
            beforeSend:function(xhr){
                filter.find('button').text('Processing...'); 
            },
            success:function(data){
                filter.find('button').text('Apply filter');
                $('#response').html(data); 
            }
        });
        return false;
    });

谢谢 rabox

Answer 1

您不能仅将其更改为$('#filter').change(...，因为格式#filter不会触发更改事件。

您将不得不聆听实际选择元素上的更改，然后才能从页面中删除按钮。

以下应能工作。

首先，我给您的类别过滤器一个ID或类：

echo '<select class="categoryfilter" name="categoryfilter"><option value="">Categorias</option>';

然后在Javascript中，只需将选择器更改为下拉列表即可。

$('.categoryfilter').change(function(){

        var filter = $('#filter');

        $.ajax({
            url: filter.attr('action'),
            data: filter.serialize(), 
            type: filter.attr('method'), 
            beforeSend:function(xhr){
                //Show loading spinner
            },
            success:function(data){
                //Cancel loading spinner.
                $('#response').html(data); 
            }
        });
        return false;
});

选择选项后如何触发事件

1 个答案: