我需要修复此代码，以便手风琴可以在点击时打开和关闭。我正在使用一个包含手风琴模块的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);
这是我认为与之相关的module.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 );
}
}
如何解决这个问题的任何见解将非常感激。
谢谢！
答案 0 :(得分：0)
指向包含问题内容的示例页面的链接可能对建议正确的答案很有用，但是为了分析您的代码，我有一个可行的解决方案。
尝试使用以下代码并在js脚本中将其排入队列，以便在第二次点击时关闭手风琴。
$( ".dslc-accordion" ).accordion({
icons: icons,
collapsible: true
});
让我知道它是否有效。