页面加载及Select值变更时执行匿名JS函数的实现问询

嗨，这个需求其实很好实现，核心就是把你藏在change事件里的匿名AJAX逻辑抽成一个命名函数，这样不管是页面初始化加载，还是下拉框值变化，都能直接调用它。

咱一步步来调整你的代码：

1. 把AJAX逻辑提取成独立的命名函数
   把原来写在change回调里的代码单独拎出来，给它起个清晰的名字，比如loadBranchOptions，这样复用起来一目了然。

2. 在页面就绪时做两件事：

   • 给#nameregion绑定change事件，触发这个函数
   • 直接调用一次函数，实现页面加载时自动执行

调整后的完整代码如下：

$(document).ready(function() {
    // 提取出来的命名函数，负责加载分支选项
    function loadBranchOptions() {
        var region = $("#nameregion").val(); // 用jQuery简化取值
        $.ajax({
            type: "POST",
            url: "namebranch.php",
            data: { 'myRegion': region },
            success: function(data) {
                $("#namebranchoptions").html(data);
            }
        });
    }

    // 绑定change事件，值变化时触发函数
    $("#nameregion").change(loadBranchOptions);

    // 页面加载完成后立即执行一次，初始化分支选项
    loadBranchOptions();
});

额外小提示： #

• 用$("#nameregion").val()代替原生的document.getElementById，更符合jQuery的写法风格，代码也更简洁。
• 如果页面初始化时#nameregion已经有默认值，这个函数会自动根据默认值加载对应的分支选项，完美契合你的需求～

内容的提问来源于stack exchange，提问作者Ken Mayer