gpt4 book ai didi

javascript - JQuery-ui 组件在加载时不显示

转载 作者:行者123 更新时间:2023-11-28 20:17:50 25 4
gpt4 key购买 nike

我正在编写一个包含两个 JQuery-ui 组件的 HTML 页面:选项卡和折叠面板。如果我在 JSFiddle 上尝试代码,两个组件都会正确显示。但如果我在本地尝试,它们就不会出现。

我使用的是 Chrome,如果我检查源代码,我可以从源代码中打开 css 和 js 关联文件,因此路径必须正确。

我猜问题出在初始化脚本上。首先,我尝试使用以下代码导入另一个 js 文件:

        $(function() {
$('#accordion').accordion();
$('#results').tabs();
}

但这没有用。所以我尝试将其写入 HTML 文件,如下所示:

<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link type="text/css" href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet"/>
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript">
$(function() {
$('#accordion').accordion();
$('#results').tabs();
}
</script>
</head>

<body>
<div id="accordion">
<h3>1st menu</h3>
<div id="1stmenu-controls" class="accordion-content">
Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
</div>
<h3>2nd menu</h3>
<div id="2stmenu-controls" class="accordion-content">

</div>
<h3>3rd menu</h3>
<div id="3stmenu-controls" class="accordion-content">

</div>
</div>

<div id="results">
<ul>
<li><a href="#tabs-1">Graphic results</a></li>
<li><a href="#tabs-2">Text results</a></li>
<li><a href="#tabs-3">Other</a></li>
</ul>

<div id="tabs-1">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<img src="images/barh_demo.png" alt="Graphic results" height="300" width="400"/>
</div>
<div id="tabs-2">
Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.
</div>
<div id="tabs-3">
Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.
</div>
</div>
</body>
</html>

也没有用。我想我在 document.ready 事件中加载 jquery-ui 组件时犯了一些愚蠢的错误,丢失了一些东西。有什么帮助吗?

最佳答案

您的代码没有右大括号。它应该看起来像:

$(function() {
$('#accordion').accordion();
$('#results').tabs();
});

刚刚在追踪过程中观察到了这一点。 :)

关于javascript - JQuery-ui 组件在加载时不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18892731/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com