Question

我正在使用JQuery标签，我有一个问题需要选择＆amp;在文档准备好上加载选项卡内容我有以下JSP页面：

<script>            
        $(function() {
            $("#welcomeLink").click(function() {
                $('#welcome').load('/HomeAutomation/private/welcome');
                return true;
            });

            $("#boilerLink").click(function() {
                $('#boiler').load('/HomeAutomation/private/boiler');
                return true;
            });

            $("li").click(function() {
                $("li").removeClass("active");
                $(this).addClass("active");
            });

            $("#menu").tabs();
            $("#boilerLink").trigger('click');
        });
    </script>
</head>
<body>
    <div class="mainFrame">
        <div id="menu">
            <ul id="tabs">
                <li><div id="welcomeLink"><a href="#tab-1">Welcome</a></div></li>
                <li><div id="boilerLink"><a href="#tab-2">Boiler</a></div></li>
            </ul>
            <div id="tab-1"><br>
                <div id="welcome"></div>
            </div>
            <div id="tab-2"><br>
                <div id="boiler"></div>
            </div>
        </div>
    </div>
</body>

当我加载页面时，选项卡'Boiler'已被很好地选中，但他的内容未加载。但是：

函数“$（”＃boilerLink“）。click（function（）”调用良好（通过警报测试）。
如果我用鼠标光标点击它，标签的效果非常好。
如果我反转两个'li'标签：它是有效的！似乎只能选择第一个标签。

提前谢谢。

Answer 1

我不完全确定您的代码无法正常工作，但您可以尝试使用jQuery UI的内置AJAX功能。

只需将href属性设置为外部内容的网址：

 <div class="mainFrame">
   <div id="menu">
     <ul id="tabs">
       <li><a href="/HomeAutomation/private/welcome">Welcome</a></li>
       <li><a href="/HomeAutomation/private/boiler">Boiler</a></li>
     </ul>
   </div>
 </div>

并指定默认情况下应激活第二个选项卡：

$(function() {
  $("#menu").tabs({
    active: 1
  });
});

Jquery选项卡：默认选择和加载JSP

1 个答案: