个人中心
gpt4 book ai didi

javascript - 选项卡无法尝试从 Jquery ui 1.8.20 升级到 1.10.3

转载 作者：行者123 更新时间：2023-11-28 10:14:43 25 4
gpt4 key购买 nike

我似乎看不到 jquery ui 从版本 1.8.20 到我现在使用的版本 1.10.3 的更改日志中发生了什么变化

我正在从数据库中动态提取数据，并根据需要复制选项卡。选项卡不起作用，而是显示页面上所有打开的 div。所以我猜它好像 hide css 不起作用。当您点击标签时，标签也不会执行任何操作。

它正在创建选项卡并显示内容。正如我所说，除非您选择一个选项卡，否则所有 div 都会显示而不是被隐藏。因此，依次单击选项卡不会执行任何操作，因为所有内容都已显示。

我认为需要更改的部分脚本在这里:

<html style="height:100% !important;">
<head>
<title></title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!--Loading bootstrap css-->
<link type="text/css"
href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,800italic,400,700,800">
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oswald:400,700,300">
<link type="text/css" rel="stylesheet" href="vendors/font-awesome/css/font-awesome.min.css">
<link type="text/css" rel="stylesheet" href="vendors/bootstrap/css/bootstrap.min.css">
<!--LOADING SCRIPTS FOR PAGE-->
<link type="text/css" rel="stylesheet" href="vendors/dhtmlxGantt/dhtmlxgantt.css">
<!--Loading style vendors-->
<link type="text/css" rel="stylesheet" href="vendors/animate.css/animate.css">
<link type="text/css" rel="stylesheet" href="vendors/jquery-pace/pace.css">
<!--Loading style-->
<link type="text/css" rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="style-mango.css" id="theme-style">
<link type="text/css" rel="stylesheet" href="css/themes/default.css" id="color-style">
<link type="text/css" rel="stylesheet" href="css/vendors.css">
<link type="text/css" rel="stylesheet" href="css/style-responsive.css">
<link type="text/css" href="vendors/jquery-ui-1.10.3.custom/css/ui-lightness/jquery-ui-1.10.3.custom.css" rel="stylesheet" /> 
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<link rel="shortcut icon" href="images/icons/favicon.ico">
</head>

<!--BEGIN CONTENT-->
<div class="page-content" style="min-height:1400px;">

                            <div class="col-md-9" id="nfw_body_body" style="height:100%;">

<style>

div.ui-tabs { width:100%; height:80%; min-height:700px; margin:5px; float:left; border:none; }

#tabs .ui-widget-content { border:none; padding:0px; margin:0px; background-color:#fff !important;" }

}
</style>

<script language="javascript">

var dyna_tabs = {

tabs: null,

init: function (id) {
    var tabs = $('<div></div>').append('<div id="'+ id + '"></div>');
    $('#nfw_body_body').append(tabs);

    var list = $('<ul></ul').append('<li><a href="#"></a></li>');
    tabs.append(list);

    tabs.tabs();

    // remove the dummy tab
    tabs.tabs('remove', 0);
    tabs.hide();

    this.tabs = tabs;
},

add: function (tab_id, tab_name, tab_content) {
    if (this.tabs != null) {
        if (this.tabs.css('display') == 'none') {
            this.tabs.show();
        }
        var data = $('<div id="'+tab_id+'"></div>').append(tab_content);
        this.tabs.append(data).tabs('add', '#' + tab_id, tab_name);
        this.tabs.tabs('beforeActivate', '#' + 1);
    } else {
        alert('Tabs not initialized!');
    }
  }

};


$(document).ready(function() {  

 dyna_tabs.init('mytabs');

  dyna_tabs.add(
        'tabs-' + 1, 
        ' User Details', 
        '<div id="tabs-1" ></div>'
    );

     $('#tabs-1').load("content/change_user_details.php?user_id=");



 dyna_tabs.add(
        'tabs-' + 2, 
        'Pest Control', 
        '<div id="tabs-2"><h2>Pest Control</h2></div>'
    );

    $('#tabs-' + 2).load("content/change_service_details.php?service_id=");

2   

 dyna_tabs.add(
        'tabs-' + 3, 
        'House Cleaning', 
        '<div id="tabs-3"><h2>House Cleaning</h2></div>'
    );

    $('#tabs-' + 3).load("content/change_service_details.php?service_id=);

3 


});


</script>
</div>
<!--END CONTENT-->
                                        </div>
<!--END CONTENT-->
<!--START FOOTER -->
<script src="js/jquery-migrate-1.2.1.min.js"></script>
<!--loading bootstrap js-->
<script src="vendors/bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/bootstrap-hover-dropdown/bootstrap-hover-dropdown.js"></script>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<script src="vendors/metisMenu/jquery.metisMenu.js"></script>
<script src="vendors/slimScroll/jquery.slimscroll.js"></script>
<script src="vendors/jquery-cookie/jquery.cookie.js"></script>
<script src="js/jquery.menu.js"></script>
<script src="vendors/jquery-pace/pace.min.js"></script>
<!--LOADING SCRIPTS FOR PAGE-->
<!--CORE JAVASCRIPT-->
<script src="js/main.js"></script>
<script src="js/holder.js"></script>
<!--END FOOTER-- >

最佳答案

这是通过 jquery 的多个版本和调用解决的。只能调用一个。

关于javascript - 选项卡无法尝试从 Jquery ui 1.8.20 升级到 1.10.3，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24255296/

25 4 0
文章推荐： javascript - JavaScript 中的 setTimeout
文章推荐： ios - 如何使用 SkyFloatingLabelTextField 在 swift 中验证 textField
文章推荐： javascript - 什么会导致 Rails 3.1 "= require jquery"停止工作？
文章推荐： ios - 为一个 UIView 中的每个元素设置动画
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com