Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/70.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
底部的Jquery UI选项卡工作不正常_Jquery_Tabs_Jquery Ui Tabs - Fatal编程技术网

底部的Jquery UI选项卡工作不正常

底部的Jquery UI选项卡工作不正常,jquery,tabs,jquery-ui-tabs,Jquery,Tabs,Jquery Ui Tabs,我正在使用jquery UI选项卡,如果我现在将选项卡向下移动时将选项卡标题保持在选项卡上方,那么它工作正常,但如果我在contet部分添加一些ulli,它将停止工作。作为标签的标题,这里是我的html <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Tabs - Default functionality</

我正在使用jquery UI选项卡,如果我现在将选项卡向下移动时将选项卡标题保持在选项卡上方,那么它工作正常,但如果我在contet部分添加一些ulli,它将停止工作。作为标签的标题,这里是我的html

<!doctype html>
<html lang="en">
 <head>
  <meta charset="utf-8">
  <title>jQuery UI Tabs - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script src="http://code.jquery.com/ui/1.11.0/jquery-ui.js"></script>

  <script>
    $(function() {
      $( "#tabs" ).tabs();
    });
  </script>
</head>
<body>
  <div id="tabs">

    <div id="tabs-1">
      <ul> 
         <li> test content1</li> 
         <li> test content1</li>  
      </ul>
      <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
    </div>
    <div id="tabs-2">
         <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
     </div>
     <div id="tabs-3">
        <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
        <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
      </div>
   <ul>
     <li><a href="#tabs-1">Nunc tincidunt</a></li>
     <li><a href="#tabs-2">Proin dolor</a></li>
     <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>
   </div>
  </body>
</html>

jQuery UI选项卡-默认功能
$(函数(){
$(“#制表符”).tabs();
});
  • 测试内容1
  • 测试内容1
青蒿素、金樱子、天妇罗、金樱子a、金樱子。库拉比图尔nec arcu。我坐在阿梅特·莫里斯旁边。这是一个很好的例子。埃蒂亚姆·阿利奎特·马萨和洛雷姆。毛里斯·达比乌斯·拉库斯·奥克托·里苏斯。埃涅亚临时乌拉姆科珀狮子座。维瓦摩斯·塞德·马格纳·奎斯·利古拉·埃利弗德·阿迪皮斯。杜伊斯·奥奇。苏打水煎饼或同侧生命。阿利奎姆·努拉。我是阿利奎姆·莫莱斯蒂·埃拉特。这是一种新的葡萄品种。这是我的梦想。同侧相位。努克·特里斯蒂克·坦普斯·莱克图斯

Morbi tincidunt,我坐在医院里,看医生,看医生,看医生,看医生。杜伊斯·塞勒里克·莫莱斯蒂·图皮斯。塞德·弗林利亚,马萨·埃吉特·卢克图斯·马莱苏阿达,梅特斯·厄洛斯·莫莱斯蒂·莱克托斯,我们的厄洛斯·多洛。埃尼安·阿利奎特·弗林利亚。悬钩子在舌苔中是舌苔。在爱神的前庭里祈祷。临床医生。库拉比图尔·奥纳雷·康塞奎特·努克。埃尼安·韦尔梅特斯。乌特·波苏尔·维韦拉·努拉。阿利奎姆·埃拉特·帕特。佩伦茨克康瓦利斯。梅塞纳斯·费吉亚、佩伦特斯·普雷蒂姆·波苏尔、猫科动物奥勒姆·尤伊斯莫·费利斯、欧纳·利奥·尼西·维勒·费利斯。毛里斯·康塞德图尔·托托和珀鲁斯

毛里斯·埃利芬德和图皮斯。酒后驾车。潜力悬钩子。这是一种腐败,是一种腐败,是一种腐败,是一种腐败,是一种腐败,是一种腐败。前庭无前庭。根据康努比亚·诺斯特拉(conubia nostra)和希梅纳奥斯(inceptos himenaeos)的规定,社会责任和责任等级为:。Fusce苏打啤酒。这是一个很好的例子。这是一种很好的治疗方法。库拉比图尔·洛雷姆·埃尼姆、普雷蒂姆·内克、福吉亚·内克、卢克图斯·a、拉克斯

杜伊斯·库苏斯。梅塞纳斯·利古拉·厄罗斯、布兰迪·内克、法雷特拉、森佩尔、麦格纳。纳拉姆ac拉克斯。无便利。普雷森特·维韦拉·胡斯托·维塔·内克。普拉森特·布兰迪特·维利特。潜力悬钩子。Donec mattis,pede vel pharetra blandit,magna ligula faucibus eros,id euismod lacus dolor eget odio。南斯克利斯克。Donec non libero sed nulla mattis commodo。Ut矢状位。Donec nisi lectus,封建者porttitor,临时ac,临时vitae,pede。这是一种交通工具。Maecenas commodo。佩伦茨克nec精英。拉库斯的福斯。维瓦摩斯是自由人,莱克图斯·亨德雷特·亨德雷特

这是小提琴

如果您切换
ul
元素并将其移到顶部,则一切正常:

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Nunc tincidunt</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tab3">Aenean lacinia</a></li>
    </ul>

    <div id="tabs-1">
        <p>1.</p>
        <ul>  <li> hello world </li></ul>
    </div>
    <div id="tabs-2">
        <p>2.</p>
    </div>
    <div id="tab3">
        <p>3.</p>

    </div>
</div>

一,

  • 你好,世界
    • 二,

      三,

您可以使用CSS将选项卡的位置移动到底部。见上面的演示


查看并搜索
\u getList()
您好如果我直接编辑jquery库并在get list函数中添加类,它对我来说很好。我如何重写该函数?是的,我知道它在顶部工作,但在我的设计中,选项卡在底部。我如何设置它?您必须使用CSS将选项卡移动到底部。标记应该保持不变。见: