如何将点击触发的jQuery外部页面加载改为无需按钮的自动加载模式

实现方案 #

你只需要调整JS逻辑、移除按钮元素两个改动即可，修改后的完整代码如下：

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>   
<script type="text/javascript">
$(document).ready(function(){
    // 直接在DOM加载完成后执行加载逻辑，不需要绑定点击事件
    $("#output").load("https://somesite.com/Search.html");
});
</script>
<body>
    <div class="formClass">
        <div id="output">
        </div>
        <!-- 已移除不需要的按钮元素 -->
    </div>
</body>

改动说明 #

• 移除了原本的按钮点击事件绑定逻辑，直接将load请求放在$(document).ready的回调中，页面DOM初始化完成后就会自动触发加载
• 直接删除了HTML中的<button>标签，不需要保留相关元素

注意事项 #

该实现受浏览器同源策略限制，如果目标站点somesite.com没有配置跨域资源共享（CORS）规则允许你的站点发起请求，加载请求会被浏览器拦截报错，你需要提前确认跨域配置符合要求。

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