[英]How do I add an active class to Foundation accordion dd element?
我試圖弄清楚如何在Foundation的手風琴中為<dd>
添加活動類。 現在,僅對div中的內容啟用了活動狀態,而對<dd>
卻沒有啟用,這是我要的。
問題也在此處描述: http : //foundation.zurb.com/forum/posts/1061-accordion-foundation-5
當前:
<dd>
<a href="#panel1">Title</a>
<div id="panel1" class="content active">Content</div>
</dd>
期望的:
<dd class="active">
<a href="#panel1">Title</a>
<div id="panel1" class="content active">Content</div>
</dd>
這是當前foundation.accordion.js的代碼:
;(function ($, window, document, undefined) {
'use strict';
Foundation.libs.accordion = {
name : 'accordion',
version : '5.0.1',
settings : {
active_class: 'active',
toggleable: true
},
init : function (scope, method, options) {
this.bindings(method, options);
},
events : function () {
$(this.scope).off('.accordion').on('click.fndtn.accordion', '[data-accordion] > dd > a', function (e) {
var accordion = $(this).parent(),
target = $('#' + this.href.split('#')[1]),
siblings = $('> dd > .content', target.closest('[data-accordion]')),
settings = accordion.parent().data('accordion-init'),
active = $('> dd > .content.' + settings.active_class, accordion.parent());
e.preventDefault();
if (active[0] == target[0] && settings.toggleable) {
return target.toggleClass(settings.active_class);
}
siblings.removeClass(settings.active_class);
target.addClass(settings.active_class);
});
},
你可以為此使用jQuery
on_some_event {
$("dd").addClass("active"); //adds 'active' class to all <dd> elements
$("dd").removeClass("active"); //removes 'active' class from all <dd> elements
$("dd").toggleClass("active"); //toggles 'active' class for all <dd> elements
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.