Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/70.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在页面加载时首次加载ajax_Javascript_Jquery_Html_Ajax - Fatal编程技术网

Javascript 在页面加载时首次加载ajax

Javascript 在页面加载时首次加载ajax,javascript,jquery,html,ajax,Javascript,Jquery,Html,Ajax,在我的PHP页面上,我使用AJAX获取拍卖物品,当从下拉列表中选择物品时,一切都正常工作,如图1所示。我的问题是,当页面第一次加载并看到第二张图片时,当我只想像其他页面一样在Ajax中加载下拉列表的默认值时,什么都没有发生,我该如何解决这个问题?请注意,在第一张图片中,我首先选择了其他内容,然后再次选择了默认值,第二张图片是我打开浏览器而不执行其他操作时的页面 我的代码: $(function() { $("#filtercatselect").on("change", function

在我的PHP页面上,我使用AJAX获取拍卖物品,当从下拉列表中选择物品时,一切都正常工作,如图1所示。我的问题是,当页面第一次加载并看到第二张图片时,当我只想像其他页面一样在Ajax中加载下拉列表的默认值时,什么都没有发生,我该如何解决这个问题?请注意,在第一张图片中,我首先选择了其他内容,然后再次选择了默认值,第二张图片是我打开浏览器而不执行其他操作时的页面

我的代码:

$(function() {
    $("#filtercatselect").on("change", function() {
        var categoryid = document.getElementById("filtercatselect").value;
        var orderbyname = document.getElementById("filterorderbyselect").value;
        if(categoryid == "")
        {
            categoryid = 0;
        }
        $.post('homefiltering.php', { catid: categoryid, sortname: orderbyname }, function(result) {
                $('#item-container').html(result);
            }
        );
    });
    $("#filterorderbyselect").on("change", function() {
        var categoryid = document.getElementById("filtercatselect").value;
        var orderbyname = document.getElementById("filterorderbyselect").value;
        if(categoryid == "")
        {
            categoryid = 0;
        }
        $.post('homefiltering.php', { catid: categoryid, sortname: orderbyname }, function(result) {
                $('#item-container').html(result);
            }
        );
    });
});

只需在您的代码下放置以下内容,即可在第一次执行脚本时触发更改事件

[--- your code above ---]
$("#filterorderbyselect").trigger('change');

// OR - based on what code you prefer to execute on first page execution
// place both you make two equal ajax calls- thanks to Don't Panic
$("#filtercatselect").trigger('change');

这个怎么样?加载时,调用我指定的函数名,然后将它们分配给下拉列表中的change event

$(document).ready(function(){
    // call these methods on load
    filtercatselectChangeHandler();
    filterorderbyselectChangeHandler();

    // set on-change handlers
    $("#filtercatselect").change(filtercatselectChangeHandler);
    $("#filterorderbyselect").change(filterorderbyselectChangeHandler);
});

function filtercatselectChangeHandler(){
    var categoryid = document.getElementById("filtercatselect").value;
    var orderbyname = document.getElementById("filterorderbyselect").value;
    if(categoryid == "")
    {
        categoryid = 0;
    }
    $.post('homefiltering.php', { catid: categoryid, sortname: orderbyname }, function(result) {
            $('#item-container').html(result);
        }
    );
}

function filterorderbyselectChangeHandler(){
    var categoryid = document.getElementById("filtercatselect").value;
    var orderbyname = document.getElementById("filterorderbyselect").value;
    if(categoryid == "")
    {
        categoryid = 0;
    }
    $.post('homefiltering.php', { catid: categoryid, sortname: orderbyname }, function(result) {
            $('#item-container').html(result);
        }
    );
}

你的意思是肯定准备好了,但他的exampe代码在$function中,它与$document相等。readyWorks完美无瑕!非常感谢。我相信这会产生两个完全相同的AJAX请求,对吗?@Don'tPanic-是的,你是对的,我写这两个函数是因为我不知道他想在第一个页面加载时执行哪个函数-我编辑我的帖子以明确这一点我喜欢这种方法,但除非我错过了什么,否则这两个函数都会做完全相同的事情。在这种情况下,可能只有一个函数,对吗?