Question

我是ajax的新人，请帮助我。首先，我使用ajax分页显示数据，然后在该数据中添加过滤器。我的ajax分页工作正常，但过滤器无法正常工作。

<select name="profession" id="profession" class="form-control" style="width: 222px;"       onchange="search_author(this.value,'p_author'),loadData('',this.value)">

$(document).ready(function(){
            function loading_show(){
                $('#loading').html("<img src='img/loading.gif'/>").fadeIn('fast');
            }
            function loading_hide(){
                $('#loading').fadeOut('fast');
            }                
            function loadData(page,profess){

                loading_show();                    
                $.ajax
                ({
                    type: "POST",
                    url: "load_data.php",
                    data: {page:page ,
                           prof:profess
                           },
                       async: true,
                    success: function(msg)
                    {
                        $("#container").ajaxComplete(function(event, request, settings)
                        {
                            loading_hide();
                            $("#container").html(msg);
                        });
                    }
                });
               alert(page)  ; // working
               alert(profess)  ; //not working
            }
            loadData(1);  // For first time page load default results
            $('#container .pagination li.active').live('click',function(){
                var page = $(this).attr('p');
                loadData(page);

            });           
            $('#go_btn').live('click',function(){
                var page = parseInt($('.goto').val());
                var no_of_pages = parseInt($('.total').attr('a'));
                if(page != 0 && page <= no_of_pages){
                    loadData(page);
                }else{
                    alert('Enter a PAGE between 1 and '+no_of_pages);
                    $('.goto').val("").focus();
                    return false;
                }

            });
        });

现在我想从select dropdown onchange函数传递数据，但这不起作用。

请帮帮我。

Answer 1

这看起来不太合适：

onchange="search_author(this.value,'p_author'),loadData('',this.value)"

函数调用之间的逗号可能是语法错误。您的JavaScript控制台甚至可能会告诉您这一点。无论如何，您可以通过不使用内联JavaScript并仅在JavaScript代码中绑定change处理程序来解决该问题：

$('#profession').on('change', function () {
    search_author($(this).val(), 'p_author');
    loadData('', $(this).val());
});

Answer 2

问题是，您在loadData块的范围内声明了函数document.ready。这意味着它只能从该块内部进行访问。对外界来说，它不存在。

你必须在外面宣布它。我还会将事件处理程序与jQuery绑定，而不是直接在HTML

中绑定

function loading_show(){
    $('#loading').html("<img src='img/loading.gif'/>").fadeIn('fast');
}
function loading_hide(){
    $('#loading').fadeOut('fast');
}                
function loadData(page,profess){

    loading_show();                    
    $.ajax
    ({
        type: "POST",
        url: "load_data.php",
        data: {page:page ,
               prof:profess
               },
           async: true,
        success: function(msg)
        {
            $("#container").ajaxComplete(function(event, request, settings)
            {
                loading_hide();
                $("#container").html(msg);
            });
        }
    });
   alert(page)  ; // working
   alert(profess)  ; //not working
}

    $(document).ready(function(){

                $('#profession').on('change', function () {
                  search_author($(this).val(), 'p_author');
                  loadData(1, $(this).val());
                });

                loadData(1);  // For first time page load default results
                $('#container .pagination li.active').live('click',function(){
                    var page = $(this).attr('p');
                    loadData(page);

                });           
                $('#go_btn').live('click',function(){
                    var page = parseInt($('.goto').val());
                    var no_of_pages = parseInt($('.total').attr('a'));
                    if(page != 0 && page <= no_of_pages){
                        loadData(page);
                    }else{
                        alert('Enter a PAGE between 1 and '+no_of_pages);
                        $('.goto').val("").focus();
                        return false;
                    }

                });
            });

onchange函数不能正常运行ajax

2 个答案: