打开当天问题的标签jQuery和WordPress

我需要在自定义页面模板上创建一个选项卡，在Relatiship当前日期中打开该选项卡。

这是我的模板页

<?php
/* Template Name: Palinsesto */
get_header();


?>

<div class="td-main-content-wrap">
    <div class="td-container <?php echo $td_sidebar_position; ?>">
        <div class="td-crumb-container">
            <?php echo td_page_generator::get_page_breadcrumbs(get_the_title()); ?>
        </div>
        <div class="td-pb-row">
            <?php
            switch ($loop_sidebar_position) {
                default:
                    ?>
                        <div class="td-pb-span8 td-main-content" role="main">
                            <div class="td-ss-main-content">
                                                            <?php
                                if (have_posts()) {
                                    while ( have_posts() ) : the_post();
                                        ?>
                                        <div class="td-page-header">
                                            <h1 class="entry-title td-page-title">
                                                <span><?php the_title() ?></span>
                                            </h1>
                                        </div>
                                        <div class="td-page-content">
                                       <?php
                                            the_content();
                                    endwhile;//end loop
                                }
                                ?>

                                 <div class="tabs">
        <ul class="tabNavigation">
            <li><a href="#monday">Monday</a></li>
            <li><a href="#tuesday">Tuesday</a></li>
            <li><a href="#wednesday">Wednesday</a></li>
            <li><a href="#thursday">Thursday</a></li>
            <li><a href="#friday">Friday</a></li>
            <li><a href="#saturday">Saturday</a></li>
            <li><a href="#sunday">Sunday</a></li>
        </ul>
        <div id="monday">
            <h2>Monday</h2>
            <p>monday ...</p>
        </div>
        <div id="tuesday">

            <h2>Tuesday</h2>
            <p>tuesday ...</p>
        </div>
        <div id="wednesday">
            <h2>Wednesday</h2>
            <p>wednesday ...</p>
        </div>
        <div id="thursday">
            <h2>Thursday</h2>
            <p>thursday ...</p>
        </div>
        <div id="friday">
            <h2>Friday</h2>
            <p>friday ...</p>
        </div>
        <div id="saturday">
            <h2>Saturday</h2>
            <p>saturday ...</p>
        </div>
          <div id="sunday">
            <h2>Sunday</h2>
            <p>sunday ...</p>
        </div>
    </div>
<!--<ul class="tab">
  <li><a href="javascript:void(0)" class="tablinks" onclick="openCity(event, \'London\')">London</a></li>
  <li><a href="javascript:void(0)" class="tablinks" onclick="openCity(event, \'Paris\')">Paris</a></li>
  <li><a href="javascript:void(0)" class="tablinks" onclick="openCity(event, \'Tokyo\')">Tokyo</a></li>
</ul>

<div id="London" class="tabcontent">
  <h3>London</h3>
  <p>London is the capital city of England.</p>
</div>

<div id="Paris" class="tabcontent">
  <h3>Paris</h3>
  <p>Paris is the capital of France.</p> 
</div>

<div id="Tokyo" class="tabcontent">
  <h3>Tokyo</h3>
  <p>Tokyo is the capital of Japan.</p>
</div>        -->
                                </div>
                            </div>
                        </div>
                        <div class="td-pb-span4 td-main-sidebar" role="complementary">
                            <div class="td-ss-main-sidebar">
                                <?php get_sidebar(); ?>
                            </div>
                        </div>
                    <?php
                    break;
            }
            ?>
        </div> <!-- /.td-pb-row -->
    </div> <!-- /.td-container -->
</div> <!-- /.td-main-content-wrap -->
    <?php
get_footer();

我在这里输入了关于工作日选项卡的代码

                   <div class="tabs">
<ul class="tabNavigation">
    <li><a href="#monday">Monday</a></li>
    <li><a href="#tuesday">Tuesday</a></li>
    <li><a href="#wednesday">Wednesday</a></li>
    <li><a href="#thursday">Thursday</a></li>
    <li><a href="#friday">Friday</a></li>
    <li><a href="#saturday">Saturday</a></li>
    <li><a href="#sunday">Sunday</a></li>
</ul>
<div id="monday">
    <h2>Monday</h2>
    <p>monday ...</p>
</div>
<div id="tuesday">

    <h2>Tuesday</h2>
    <p>tuesday ...</p>
</div>
<div id="wednesday">
    <h2>Wednesday</h2>
    <p>wednesday ...</p>
</div>
<div id="thursday">
    <h2>Thursday</h2>
    <p>thursday ...</p>
</div>
<div id="friday">
    <h2>Friday</h2>
    <p>friday ...</p>
</div>
<div id="saturday">
    <h2>Saturday</h2>
    <p>saturday ...</p>
</div>
  <div id="sunday">
    <h2>Sunday</h2>
    <p>sunday ...</p>
</div>

开机后功能。php我已经添加了这个脚本代码

 /* Date Current */

 function wpse203799_footerscript(){
 ?>
<script type="text/javascript">
$(function() {
    var tabContainers = $(\'div.tabs > div\');
    $(\'div.tabs ul.tabNavigation a\').click(function () {
        tabContainers.hide().filter(this.hash).show();

        $(\'div.tabs ul.tabNavigation a\').removeClass(\'selected\');
        $(this).addClass(\'selected\');

        return false;
    }).eq((new Date().getDay() || 7) - 1).click();
});
</script>
 <?php
add_action( \'wp_footer\', \'wpse203799_footerscript\', \'30\' ); }?>

但不起作用。我显示一个简单的列表，而不是选项卡。我也试着

<script>
$(function() {
    var tabContainers = $(\'div.tabs > div\');
    $(\'div.tabs ul.tabNavigation a\').click(function () {
        tabContainers.hide().filter(this.hash).show();

        $(\'div.tabs ul.tabNavigation a\').removeClass(\'selected\');
        $(this).addClass(\'selected\');

        return false;
    }).eq((new Date().getDay() || 7) - 1).click();
});

之前的直接页面自定义？>关闭标题，但无任何更改。哪里错了？谢谢

小码农CODE

相关推荐

如何在WordPress中包含jQuery-UI库？