如何实现jQuery轮询检测目标select元素并执行赋值触发操作？

可以通过递归轮询函数实现需求：先检测目标元素是否存在，存在则直接执行赋值和触发change事件；不存在则延迟500ms后再次检测，直到元素出现为止。

实现代码 #

<script>
require(['jquery'], function($){
    // 定义轮询函数
    function checkAndSetCountry() {
        const $countrySelect = $('select[name="country_id"]');
        if ($countrySelect.length > 0) {
            // 元素已存在，执行操作
            $countrySelect.val('BE').change();
        } else {
            // 元素未存在，延迟500ms后再次检测
            setTimeout(checkAndSetCountry, 500);
        }
    }

    // 启动轮询
    checkAndSetCountry();
});
</script>

补充优化说明 #

• 递归逻辑会自动在元素出现时终止轮询，无需手动停止
• 可选添加最大尝试次数限制，避免极端情况下的无限轮询，示例如下：

<script>
require(['jquery'], function($){
    let maxAttempts = 20; // 最多尝试20次，合计10秒
    function checkAndSetCountry() {
        if (maxAttempts <= 0) return; // 达到最大次数后停止
        const $countrySelect = $('select[name="country_id"]');
        if ($countrySelect.length > 0) {
            $countrySelect.val('BE').change();
        } else {
            maxAttempts--;
            setTimeout(checkAndSetCountry, 500);
        }
    }
    checkAndSetCountry();
});
</script>

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