标签: jquery-ui-accordion
JQUERY UI Accordion开始崩溃
如何在表单加载时使jquery UI手风琴开始折叠.这有什么JavaScript代码吗？
推荐指数
解决办法
查看次数
使用jquery将项添加到jQuery Accordion
我正在使用jQuery手风琴插件制作一些手风琴的数据.然后我希望用户能够向手风琴添加更多数据.我已经设置了手风琴以便正常工作,然后我已经创建了一个函数,为手风琴前置一个匹配手风琴语义的"列表项".
是否可以"更新"手风琴以使其与新添加的元素一起使用,而无需将新数据保存到数据库并刷新页面？
像这样的东西:
.accordion('refresh')
或者类似于jQuery 1.3中添加的直播活动,任何人都有线索？
推荐指数
解决办法
查看次数
jQuery UI Accordion展开/折叠全部
我在项目中使用jQuery UI Accordion(一次不允许打开多个项目).利用手风琴,因为我通常是合适的就只需要一次一个打开的面板.
但是,我需要提供一个"全部展开"链接,单击该按钮可切换到"全部折叠".我不想在这个要求周围自定义几乎相同的手风琴功能,所以我想要一些JS来实现这一点,同时保持Accordion组件的使用.
问题:在使用jQuery UI"Accordion"组件为标准功能提供支持的同时,需要哪些JavaScript/jQuery才能实现这一目标？
这是一个小提琴:http://jsfiddle.net/alecrust/a6Cu7/
推荐指数
解决办法
查看次数
jQuery - 桌上的手风琴效果
我在使用jQuery在三个不同的表上实现手风琴效果时遇到了困难,我可以使用一些帮助.现在它工作正常当我点击后续行显示的标题行时,我想要某种类型的动画.我也想完全展示第一张桌子,但我是新手,这是我的头脑.
这是我的HTML.
<table class="research">
<tbody>
<tr class="accordion">
<td colspan="3">This is the header</td>
</tr>
<tr>
<td>Research</td>
<td>Description</td>
<td>Partner</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</td>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</td>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</td>
</tr>
</tbody>
</table>
<table class="research">
<tbody>
<tr class="accordion">
<td colspan="3">This is the header</td>
</tr>
<tr>
<td>Research</td>
<td>Description</td>
<td>Partner</td>
</tr>
<tr>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</td>
<td>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</td>
<td>Lorem …推荐指数
解决办法
查看次数
jQuery UI:TypeError:$(...).accordion不是一个函数
出于某种原因,jQuery UI Accordion不起作用.我一直收到这个错误:
TypeError:$(...).accordion不是一个函数
我究竟做错了什么？基于此网站上类似主题的其他答案,我认为它与包含的文件有关.
我的标题包括:
<!-- Mobile Specific Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- CSS -->
<link rel="stylesheet" href="<?php echo base_url(); ?>css/base_con.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>css/skeleton.css">
<link rel="stylesheet" href="<?php echo base_url(); ?>css/layout.css">
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Favicons -->
<link rel="shortcut icon" href="<?php echo base_url(); ?>images/favicon.ico">
<link rel="apple-touch-icon" href="<?php echo base_url(); ?>images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="stylesheet" href="<?php …推荐指数
解决办法
查看次数
在jQuery UI中向Accordion小部件动态添加和刷新元素
关于SO的几个问题引用了这个开放的jQuery UI功能请求,可以从Accordion小部件动态添加/删除面板.票证本身已标记(已关闭的功能:已修复),从我从单元测试中可以看出的内容以及来自其Git存储库的提示,它似乎在最新版本中实现.
但是,如果我尝试像上面的单元测试中那样添加div:
var element = $("#accordion");
$("#accordion").append("<h3>3</h3><div>3</div>");
$("#accordion").accordion("refresh");
我无法让它发挥作用.
但是这种方法有效:
$("#accordion").append("<h3>sec</h3<div>test</div>").accordion("destroy").accordion();
但我不想"摧毁"手风琴,我只想追加(或前置)一个元素并刷新它.
看看我在Chrome的检查器中添加的div显示我添加的元素没有添加与手风琴其余部分相同的CSS样式:
推荐指数
解决办法
查看次数
在jQuery slideDown动画结束时修复垂直跳转
我是Jquery的新手,但写过一部简单的垂直手风琴.这似乎是我需要的工作,但在滑动结束时有一个可见的混蛋.
如果有人能看到它并建议解决方案,它将阻止我拉出我的头发!
这是我的测试页面的链接(我的所有代码[css,js等]都在一个文件中以方便):Vertical Accordion
推荐指数
解决办法
查看次数
jquery ui accordion - 多种手风琴扩展/解决所有风格的问题
我正在尝试创建一个手风琴,只需单击一下即可展开/折叠所有部分.我还需要用户能够打开和关闭一次打开0-n部分的部分.使用stackoverflow和jquery论坛上的几个讨论,这里是我提出的解决方案:我已经实现了每个部分,因为它是自己的手风琴,其中每个都设置为collapsible = true.
<html>
<head>
<title>Accordion Test</title>
<script type="text/javascript" src="../scripts/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../scripts/jquery-ui-1.8.4.custom.min.js"></script>
<link rel="stylesheet" href="../_templates/css/jquery-ui-1.8.6.custom.css" type="text/css" />
<link rel="stylesheet" href="../_templates/css/jquery.ui.accordion.css" type="text/css" />
</head>
<body>
<a onClick="expandAll()">Expand All</a>
<br>
<a onClick="collapseAll()">Collapse All</a>
<div id="accordion1" class="accord">
<h5><a href="#">section 1</a></h5>
<div>
section 1 text
</div>
</div>
<!-- orders section -->
<div id="accordion2" class="accord">
<h5><a href="#">section 2</a></h5>
<div>
section 2 text
</div>
</div>
<!-- section 3 -->
<div id="accordion3" class="accord">
<h5><a href="#">section 3</a></h5>
<div>
section 3 text
</div>
</div>
<!-- section 4 --> …推荐指数
解决办法
查看次数
knockout.js和jQueryUI创建一个手风琴菜单
尝试让jquery UI和淘汰js共同操作时遇到了一些小问题.基本上我想创建一个手风琴,通过foreach(或模板)从淘汰赛中添加项目.
基本代码如下:
<div id="accordion">
<div data-bind="foreach: items">
<h3><a href="#" data-bind="text: text"></a></h3>
<div><a class="linkField" href="#" data-bind="text: link"></a></div>
</div>
</div>
这里没有什么令人印象深刻的...问题是,如果我做了类似的事情:
$('#accordion').accordion();
将创建手风琴但内部div将是标题选择器(默认情况下为第一个子节点),因此效果不是所需的效果.
用这个修复东西:
$('#accordion').accordion({ header: 'h3' });
似乎工作得更好,但实际上创造了2个手风琴,而不是一个有2个部分......很奇怪.
我试图探索淘汰模板并使用"afterRender"来重新演奏div,但无济于事......它似乎只重新渲染第一个链接作为手风琴而不是第二个.可能这是因为我的初学者知道了jquery UI.
你知道如何让一切都协同工作吗？
推荐指数
解决办法
查看次数
选中复选框后,Twitter Bootstrap 3崩溃
手风琴必须在选中复选框时折叠.并且必须在未经检查时隐藏.
这是代码:http://jsfiddle.net/UwL5L/2/
为什么不检查？
<div class="panel-group driving-license-settings" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
<input type="checkbox" value=""> I have Driver License
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
<div class="driving-license-kind">
<div class="checkbox">
<input type="checkbox" value="">A
</div>
<div class="checkbox">
<input type="checkbox" value="">B
</div>
<div class="checkbox">
<input type="checkbox" value="">C
</div>
<div class="checkbox">
<input type="checkbox" value="">D
</div>
<div class="checkbox">
<input type="checkbox" value="">E
</div>
</div>
</div>
</div>
</div>
</div>
javascript jquery jquery-ui-accordion twitter-bootstrap twitter-bootstrap-3
推荐指数
解决办法
查看次数