关闭手风琴在第二次点击
Close accordion on second click
我需要修复这个代码,以便手风琴可以打开和关闭点击。我正在使用一个包含手风琴模块的wordpress主题,并试图操纵代码以满足我的需求。
这是accordion.js
( function( $ ){
$( document ).ready( function () {
// Expand/Collapse on click
$( '.accordion-container' ).on( 'click keydown', '.accordion-section-title', function( e ) {
if ( e.type === 'keydown' && 13 !== e.which ) // "return" key
return;
e.preventDefault(); // Keep this AFTER the key filter above
accordionSwitch( $( this ) );
});
// Re-initialize accordion when screen options are toggled
$( '.hide-postbox-tog' ).click( function () {
accordionInit();
});
});
var accordionOptions = $( '.accordion-container li.accordion-section' ),
sectionContent = $( '.accordion-section-content' );
function accordionInit () {
// Rounded corners
accordionOptions.removeClass( 'top bottom' );
accordionOptions.filter( ':visible' ).first().addClass( 'top' );
accordionOptions.filter( ':visible' ).last().addClass( 'bottom' ).find( sectionContent ).addClass( 'bottom' );
}
function accordionSwitch ( el ) {
var section = el.closest( '.accordion-section' ),
siblings = section.closest( '.accordion-container' ).find( '.open' ),
content = section.find( sectionContent );
if ( section.hasClass( 'cannot-expand' ) )
return;
if ( section.hasClass( 'open' ) ) {
section.toggleClass( 'open' );
content.toggle( true ).slideToggle( 150 );
} else {
siblings.removeClass( 'open' );
siblings.find( sectionContent ).show().slideUp( 150 );
content.toggle( false ).slideToggle( 150 );
section.toggleClass( 'open' );
}
accordionInit();
}
// Initialize the accordion (currently just corner fixes)
accordionInit();
})(jQuery);
我认为这是模块。php与它相连:
<?php
class DSLC_Accordion extends DSLC_Module {
var $module_id;
var $module_title;
var $module_icon;
var $module_category;
function __construct() {
$this->module_id = 'DSLC_Accordion';
$this->module_title = __( 'Accordion', 'dslc_string' );
$this->module_icon = 'reorder';
$this->module_category = 'elements';
}
function options() {
$dslc_options = array(
array(
'label' => __( '(hidden) Accordion Content', 'dslc_string' ),
'id' => 'accordion_content',
'std' => '',
'type' => 'textarea',
'visibility' => 'hidden',
'section' => 'styling',
),
array(
'label' => __( '(hidden) Accordion Nav', 'dslc_string' ),
'id' => 'accordion_nav',
'std' => '',
'type' => 'textarea',
'visibility' => 'hidden',
'section' => 'styling',
),
array(
'label' => __( 'Open by default', 'dslc_string' ),
'id' => 'open_by_default',
'std' => '1',
'type' => 'text',
),
/**
* General
*/
array(
'label' => __( 'BG Color', 'dslc_string' ),
'id' => 'css_bg_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'background-color',
'section' => 'styling',
),
array(
'label' => __( 'Border Color', 'dslc_string' ),
'id' => 'css_border_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'border-color',
'section' => 'styling',
),
array(
'label' => __( 'Border Width', 'dslc_string' ),
'id' => 'css_border_width',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'border-width',
'section' => 'styling',
'ext' => 'px',
),
array(
'label' => __( 'Borders', 'dslc_string' ),
'id' => 'css_border_trbl',
'std' => 'top right bottom left',
'type' => 'checkbox',
'choices' => array(
array(
'label' => __( 'Top', 'dslc_string' ),
'value' => 'top'
),
array(
'label' => __( 'Right', 'dslc_string' ),
'value' => 'right'
),
array(
'label' => __( 'Bottom', 'dslc_string' ),
'value' => 'bottom'
),
array(
'label' => __( 'Left', 'dslc_string' ),
'value' => 'left'
),
),
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'border-style',
'section' => 'styling',
),
array(
'label' => __( 'Margin Bottom', 'dslc_string' ),
'id' => 'css_margin_bottom',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'margin-bottom',
'section' => 'styling',
'ext' => 'px',
),
array(
'label' => __( 'Padding Vertical', 'dslc_string' ),
'id' => 'css_padding_vertical',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'padding-top,padding-bottom',
'section' => 'styling',
'ext' => 'px',
),
array(
'label' => __( 'Padding Horizontal', 'dslc_string' ),
'id' => 'css_padding_horizontal',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion',
'affect_on_change_rule' => 'padding-left,padding-right',
'section' => 'styling',
'ext' => 'px',
),
/**
* Header
*/
array(
'label' => __( 'BG Color', 'dslc_string' ),
'id' => 'css_header_bg_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'background-color',
'section' => 'styling',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Border Color', 'dslc_string' ),
'id' => 'css_header_border_color',
'std' => '#e8e8e8',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'border-color',
'section' => 'styling',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Border Width', 'dslc_string' ),
'id' => 'css_header_border_width',
'std' => '1',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'border-width',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Borders', 'dslc_string' ),
'id' => 'css_header_border_trbl',
'std' => 'top right bottom left',
'type' => 'checkbox',
'choices' => array(
array(
'label' => __( 'Top', 'dslc_string' ),
'value' => 'top'
),
array(
'label' => __( 'Right', 'dslc_string' ),
'value' => 'right'
),
array(
'label' => __( 'Bottom', 'dslc_string' ),
'value' => 'bottom'
),
array(
'label' => __( 'Left', 'dslc_string' ),
'value' => 'left'
),
),
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'border-style',
'section' => 'styling',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Margin Bottom', 'dslc_string' ),
'id' => 'css_header_margin_bottom',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'margin-bottom',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Padding Vertical', 'dslc_string' ),
'id' => 'css_header_padding_vertical',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'padding-top,padding-bottom',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'header', 'dslc_string' )
),
array(
'label' => __( 'Padding Horizontal', 'dslc_string' ),
'id' => 'css_header_padding_horizontal',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-header',
'affect_on_change_rule' => 'padding-left,padding-right',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'header', 'dslc_string' )
),
/**
* Title
*/
array(
'label' => __( 'BG Color', 'dslc_string' ),
'id' => 'css_title_bg_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'background-color',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Border Color', 'dslc_string' ),
'id' => 'css_title_border_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'border-color',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Border Width', 'dslc_string' ),
'id' => 'css_title_border_width',
'std' => '0',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'border-width',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Borders', 'dslc_string' ),
'id' => 'css_title_border_trbl',
'std' => 'top right bottom left',
'type' => 'checkbox',
'choices' => array(
array(
'label' => __( 'Top', 'dslc_string' ),
'value' => 'top'
),
array(
'label' => __( 'Right', 'dslc_string' ),
'value' => 'right'
),
array(
'label' => __( 'Bottom', 'dslc_string' ),
'value' => 'bottom'
),
array(
'label' => __( 'Left', 'dslc_string' ),
'value' => 'left'
),
),
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'border-style',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Color', 'dslc_string' ),
'id' => 'css_title_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'color',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Font Size', 'dslc_string' ),
'id' => 'css_title_font_size',
'std' => '12',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'font-size',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' ),
'ext' => 'px'
),
array(
'label' => __( 'Font Weight', 'dslc_string' ),
'id' => 'css_title_font_weight',
'std' => '700',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'font-weight',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' ),
'ext' => '',
'min' => 100,
'max' => 900,
'increment' => 100
),
array(
'label' => __( 'Font Family', 'dslc_string' ),
'id' => 'css_title_font_family',
'std' => 'Open Sans',
'type' => 'font',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'font-family',
'section' => 'styling',
'tab' => __( 'title', 'dslc_string' ),
),
array(
'label' => __( 'Padding Vertical', 'dslc_string' ),
'id' => 'css_title_padding_vertical',
'std' => '15',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'padding-top,padding-bottom',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'title', 'dslc_string' )
),
array(
'label' => __( 'Padding Horizontal', 'dslc_string' ),
'id' => 'css_title_padding_horizontal',
'std' => '15',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-title',
'affect_on_change_rule' => 'padding-left,padding-right',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'title', 'dslc_string' )
),
/**
* Content
*/
array(
'label' => __( 'BG Color', 'dslc_string' ),
'id' => 'css_content_bg_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'background-color',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Border Color', 'dslc_string' ),
'id' => 'css_content_border_color',
'std' => '#e8e8e8',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'border-color',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Border Width', 'dslc_string' ),
'id' => 'css_content_border_width',
'std' => '1',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'border-width',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Borders', 'dslc_string' ),
'id' => 'css_content_border_trbl',
'std' => 'right bottom left',
'type' => 'checkbox',
'choices' => array(
array(
'label' => __( 'Top', 'dslc_string' ),
'value' => 'top'
),
array(
'label' => __( 'Right', 'dslc_string' ),
'value' => 'right'
),
array(
'label' => __( 'Bottom', 'dslc_string' ),
'value' => 'bottom'
),
array(
'label' => __( 'Left', 'dslc_string' ),
'value' => 'left'
),
),
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'border-style',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Color', 'dslc_string' ),
'id' => 'css_content_color',
'std' => '',
'type' => 'color',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'color',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Font Size', 'dslc_string' ),
'id' => 'css_content_font_size',
'std' => '12',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'font-size',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' ),
'ext' => 'px'
),
array(
'label' => __( 'Font Weight', 'dslc_string' ),
'id' => 'css_content_font_weight',
'std' => '400',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'font-weight',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' ),
'ext' => '',
'min' => 100,
'max' => 900,
'increment' => 100
),
array(
'label' => __( 'Font Family', 'dslc_string' ),
'id' => 'css_content_font_family',
'std' => 'Open Sans',
'type' => 'font',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'font-family',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' ),
),
array(
'label' => __( 'Line Height', 'dslc_string' ),
'id' => 'css_content_line_height',
'std' => '22',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'line-height',
'section' => 'styling',
'tab' => __( 'content', 'dslc_string' ),
'ext' => 'px'
),
array(
'label' => __( 'Padding Vertical', 'dslc_string' ),
'id' => 'css_content_padding_vertical',
'std' => '25',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'padding-top,padding-bottom',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'content', 'dslc_string' )
),
array(
'label' => __( 'Padding Horizontal', 'dslc_string' ),
'id' => 'css_content_padding_horizontal',
'std' => '25',
'type' => 'slider',
'refresh_on_change' => false,
'affect_on_change_el' => '.dslc-accordion-content',
'affect_on_change_rule' => 'padding-left,padding-right',
'section' => 'styling',
'ext' => 'px',
'tab' => __( 'content', 'dslc_string' )
),
$dslc_options = array_merge( $dslc_options, $this->shared_options('animation_options') );
$dslc_options = array_merge( $dslc_options, $this->presets_options() );
return apply_filters( 'dslc_module_options', $dslc_options, $this->module_id );
}
function output( $options ) {
global $dslc_active;
if ( $dslc_active && is_user_logged_in() && current_user_can( DS_LIVE_COMPOSER_CAPABILITY ) )
$dslc_is_admin = true;
else
$dslc_is_admin = false;
$this->module_start( $options );
/* Module output stars here */
$accordion_nav = explode( '(dslc_sep)', trim( $options['accordion_nav'] ) );
if ( empty( $options['accordion_content'] ) )
$accordion_contents = false;
else
$accordion_contents = explode( '(dslc_sep)', trim( $options['accordion_content'] ) );
$count = 0;
?>
<div class="dslc-accordion" data-open="<?php echo $options['open_by_default']; ?>">
<?php if ( is_array( $accordion_contents ) && count( $accordion_contents ) > 0 ) : ?>
<?php foreach ( $accordion_contents as $accordion_content ) : ?>
<div class="dslc-accordion-item">
<div class="dslc-accordion-header dslc-accordion-hook">
<span class="dslc-accordion-title" <?php if ( $dslc_is_admin ) echo 'contenteditable'; ?>><?php echo $accordion_nav[$count]; ?></span>
<?php if ( $dslc_is_admin ) : ?>
<span class="dslca-delete-accordion-hook"><span class="dslca-icon dslc-icon-remove"></span></span>
<?php endif; ?>
</div>
<div class="dslc-accordion-content">
<div class="dslca-editable-content">
<?php
$accordion_content_output = stripslashes( $accordion_content );
$accordion_content_output = str_replace( '<lctextarea', '<textarea', $accordion_content_output );
$accordion_content_output = str_replace( '</lctextarea', '</textarea', $accordion_content_output );
echo $accordion_content_output;
?>
</div>
<?php if ( $dslc_is_admin ) : ?>
<div class="dslca-wysiwyg-actions-edit"><span class="dslca-wysiwyg-actions-edit-hook"><?php _e( 'Edit Content', 'dslc_string' ); ?></span></div>
<?php endif; ?>
</div><!-- .dslc-accordion-content -->
</div><!-- .dslc-accordion-item -->
<?php $count++; endforeach; ?>
<?php else : ?>
<div class="dslc-accordion-item">
<div class="dslc-accordion-header dslc-accordion-hook">
<span class="dslc-accordion-title" <?php if ( $dslc_is_admin ) echo 'contenteditable'; ?>><?php _e( 'CLICK TO EDIT', 'dslc_string' ); ?></span>
<?php if ( $dslc_is_admin ) : ?>
<span class="dslca-delete-accordion-hook"><span class="dslca-icon dslc-icon-remove"></span></span>
<?php endif; ?>
</div>
<div class="dslc-accordion-content">
<div class="dslca-editable-content">
Placeholder content. Lorem ipsum dolor sit amet, consectetur
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
<?php if ( $dslc_is_admin ) : ?>
<div class="dslca-wysiwyg-actions-edit"><span class="dslca-wysiwyg-actions-edit-hook"><?php _e( 'Edit Content', 'dslc_string' ); ?></span></div>
<?php endif; ?>
</div><!-- .dslc-accordion-content -->
</div><!-- .dslc-accordion-item -->
<?php endif; ?>
<?php if ( $dslc_is_admin ) : ?>
<div class="dslca-add-accordion">
<span class="dslca-add-accordion-hook"><span class="dslca-icon dslc-icon-plus"></span></span>
</div>
<?php endif; ?>
</div><!-- .dslc-accordion -->
<?php /* Module output ends here */
$this->module_end( $options );
}
}
对于如何解决这个问题,我将非常感激。
谢谢!
指向包含问题内容的示例页面的链接可能对建议适当的答案有用,但对于分析您的代码,我有一个可以工作的解决方案。
尝试使用以下代码并在js脚本中排队,使手风琴在第二次点击时关闭。
$( ".dslc-accordion" ).accordion({
icons: icons,
collapsible: true
});
让我知道它是否有效。
相关文章:
- Javascript Select OnChange没有'不要第二次工作
- 相同的RegExp返回不同的结果-第一次是正确的结果,第二次是null
- 单击仅在第二次单击后有效
- 推特引导:弹出窗口不会在第一次点击时出现,但会在第二次点击时显示
- 第二次点击具有不同功能的按钮并更改文本
- 更改第二次推送时不起作用的元素高度
- 在第二次选择中选择2更改属性
- on(“点击”)仅在第二次点击后触发
- 在HTML中,如果第二次加载相同的脚本文件,它还会被加载吗
- Sails.js/Waterline.add()和.remove()仅适用于第二次调用
- 尝试在两次迭代中警告同一选择器的值,在第一次迭代中得到正确的值,而在第二次迭代中获得不正确的值.为什么?
- java脚本中的谷歌地图在第二次点击时不起作用
- 更改类名后,将第二次单击事件附加到元素
- 提交按钮只能在onchange调用输入文本后第二次点击时工作
- 将音频第二次转换为分钟和秒格式
- Jquery移动转换复选框在Jquery onclick函数()中第二次选中不起作用
- 在连续第二次单击时禁用href
- 正在给用户第二次尝试
- 关闭手风琴在第二次点击
- 打开手风琴点击,关闭手风琴第二次点击