jquery tabs Content via Ajax

最新推荐文章于 2021-06-11 13:25:36 发布

fuyangclj

最新推荐文章于 2021-06-11 13:25:36 发布

阅读量835

点赞数

分类专栏： Jquery 文章标签： jquery

本文链接：https://blog.csdn.net/clj9017/article/details/11920543

版权

Jquery 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

 
 
  
  
   
   


<!doctype html>
  
  
 
 
 
 
  
  
   
    
  
  
 
 
 
 
  
  
   
   <html lang="en">
  
  
 
 
 
 
  
  
   
   <head>
  
  
 
 
 
 
  
  
   
     <meta charset="utf-8" />
  
  
 
 
 
 
  
  
   
     <title>jQuery UI Tabs - Content via Ajax</title>
  
  
 
 
 
 
  
  
   
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  
  
 
 
 
 
  
  
   
     <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  
  
 
 
 
 
  
  
   
     <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  
  
 
 
 
 
  
  
   
     <link rel="stylesheet" href="/resources/demos/style.css" />
  
  
 
 
 
 
  
  
   
     <script>
  
  
 
 
 
 
  
  
   
     $(function() {
  
  
 
 
 
 
  
  
   
       $( "#tabs" ).tabs({
  
  
 
 
 
 
  
  
   
         beforeLoad: function( event, ui ) {
  
  
 
 
 
 
  
  
   
           ui.jqXHR.error(function() {
  
  
 
 
 
 
  
  
   
             ui.panel.html(
  
  
 
 
 
 
  
  
   
               "Couldn't load this tab. We'll try to fix this as soon as possible. " +
  
  
 
 
 
 
  
  
   
               "If this wouldn't be a demo." );
  
  
 
 
 
 
  
  
   
           });
  
  
 
 
 
 
  
  
   
         }
  
  
 
 
 
 
  
  
   
       });
  
  
 
 
 
 
  
  
   
     });
  
  
 
 
 
 
  
  
   
     </script>
  
  
 
 
 
 
  
  
   
   </head>
  
  
 
 
 
 
  
  
   
   <body>
  
  
 
 
 
 
  
  
   
    
  
  
 
 
 
 
  
  
   
   <div id="tabs">
  
  
 
 
 
 
  
  
   
     <ul>
  
  
 
 
 
 
  
  
   
       <li><a href="#tabs-1">Preloaded</a></li>
  
  
 
 
 
 
  
  
   
       <li><a href="ajax/content1.html">Tab 1</a></li>
  
  
 
 
 
 
  
  
   
       <li><a href="ajax/content2.html">Tab 2</a></li>
  
  
 
 
 
 
  
  
   
       <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li>
  
  
 
 
 
 
  
  
   
       <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li>
  
  
 
 
 
 
  
  
   
     </ul>
  
  
 
 
 
 
  
  
   
     <div id="tabs-1">
  
  
 
 
 
 
  
  
   
       <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>
  
  
 
 
 
 
  
  
   
    
  
  
 
 
 
 
  
  
   
    
  
  
 
 
 
 
  
  
   
   </body>
  
  
 
 
 
 
  
  
   
   </html>

更多资源：http://jqueryui.com/tabs/#ajax

fuyangclj

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery tabs Content via Ajax

html lang="en">head> meta charset="utf-8" /> title>jQuery UI Tabs - Content via Ajaxtitle> link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> script s
复制链接

扫一扫