为点击功能设置默认页面以加载外部页面


set default page for click function to load external page

正在使用jquerydiv内部加载外部页面,效果很好但只有当我触发点击功能时,它才会打开一个外部页面

加载页面时,它应该触发第一个按钮

试过这个

function HideLoader() {
                    $('#loader').css('display', 'none');
                }
                function ShowLoader() {
                    $('#loader').css('display', 'block');
                }

                $('.reveal').on('click', function (e) {
                    var $that = $(this);
                    e.preventDefault();
                    ShowLoader();
                    var link = $(this).attr('href');
                    $('.tab-content').load(link, function () {
                        HideLoader(); // this puts it in the load callback, so that this stuff
                        $that.show(); // happens when the load is complete
                    });
                });

.HTML

<div class="btn-pref btn-group btn-group-justified btn-group-lg" role="group" aria-label="...">
                    <div class="btn-group" role="group">
                        <button type="button" class="btn btn-primary reveal" href="test.php">
                            <div class="hidden-xs">Info</div>
                        </button>
                    </div>
                    <div class="btn-group" role="group">
                        <button type="button" class="btn btn-default reveal" href="#tab2">
                            <div class="hidden-xs">Favorites</div>
                        </button>
                    </div>
                    <div class="btn-group" role="group">
                        <button type="button" class="btn btn-default reveal" href="#tab3">
                            <div class="hidden-xs">Following</div>
                        </button>
                    </div>
                    <div class="btn-group" role="group">
                        <button type="button" class="btn btn-default reveal" href="#tab3">
                            <div class="hidden-xs">Friends</div>
                        </button>
                    </div>
                </div>
 <div class="well">
                    <div class="tab-content">
                        <img src="../css/ajax-loader.gif" alt="loading" class="center" id="loader"/>
                    </div>
                </div>

这个函数index.php当我运行这个文件时,它应该显示test.php,当我去click function()函数应该继续

我尝试了上述方法,但不起作用

您可以在页面加载时自动单击第一个按钮,如下所示:

$(function() {
    $('.btn-primary').click();
});

click方法的文档有:

将事件处理程序绑定到"click"JavaScript 事件,或在元素上触发该事件。

在上面的代码中,它是我们正在做的触发。

关于 $(函数 ...):

在文档"准备就绪"之前,无法安全地操作页面。jQuery 会为您检测这种就绪状态。$( document ).ready()中包含的代码仅在页面文档对象模型 (DOM) 准备好执行 JavaScript 代码时运行。

经验丰富的开发人员有时会使用速记$()

如果这不执行任何操作,则第二个选项是等待页面完全加载(还有图像等):

$(window).load(function() {
    $('.btn-primary').click();
});

关于$(window).load

在页面完全加载(包括图形)时运行函数。

首先将 id 放在第一个按钮上

<button type="button" id="first_btn" class="btn btn-primary reveal" href="test.php">

然后

$(document).ready(function(){
   $("#first_btn").click();
});

运行并检查是否得到结果。