Question

我试图为我的插件调用jQuery DataTable JS文件，该插件使用DataTable显示数据库中的查询。 JS文件本地存储在服务器上。

WordPress：v4.0.1 jQuery：v1.11.1 DataTable：v1.10.5

未调用WordPress默认的jQuery文件。当我注册并调用托管在Google上的jQuery文件时，它似乎有效。有没有理由发生这种情况？

这是我到目前为止所做的：

的functions.php：

function load_jquery_datatables() {
    wp_enqueue_script('jquery');
    wp_register_script( 'jquery-datatables', plugins_url('js/jquery.dataTables.min.js'), array('jquery'));
    wp_enqueue_script('jquery-datatables');
}

的index.php：

<?php add_action('wp_enqueue_scripts', 'load_jquery_datatables');?>

<script>
    $(document).ready(function() {
        $('#example').DataTable();
    });
</script>

<table id="example" class="display">
            <form>
            <thead>
                <tr>
                    <td style="text-align: center;"><input type="checkbox" id="selectall"></td>
                    <?php
                    foreach ( $wpdb->get_col( "DESC " . $table_name, 0 ) as $column_name ) 
                    {
                        echo '<th style="text-align: center;">' . $column_name . '</th>';
                    }
                    ?>
                </tr>
            </thead>

            <tfoot>
                <tr>
                    <td style="text-align: center;"><input type="checkbox" id="selectall"></td>
                    <?php
                    foreach ( $wpdb->get_col( "DESC " . $table_name, 0 ) as $column_name ) 
                    {
                        echo '<th style="text-align: center;">' . $column_name . '</th>';
                    }
                    ?>
                </tr>
            </tfoot>
            <tbody>
                <?php
                foreach ( $results as $row ) 
                {
                    echo '<tr>';
                        echo '<td><input type=\'checkbox\' class=\'check\' value=' . $id . '></td>';
                        echo '<td>' . $row->id . '</td>';
                        echo '<td>' . $row->status . '</td>';
                        echo '<td>' . $row->create_time . '</td>';
                        echo '<td>' . $row->start_time . '</td>';
                        echo '<td>' . $row->duration . '</td>';
                        echo '<td>' . $row->source . '</td>';
                        echo '<td>' . $row->source_id . '</td>';
                    echo '</tr>';
                }
                    ?>
            </tbody>
</form>
    </table>

Answer 1

自从我创建了一个WordPress主题以来已经有一段时间了，但我总是使用这种方法并且效果很好！

<强>的functions.php

function custom_function_name() {
     wp_enqueue_script("jquery");
     wp_head(); ?>
     <script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/yourScript.js"></script><?php 
}

在 HEADER.PHP NOT INDEX.PHP

中采取行动

<head>
     // Link stylesheets and page titles
     // Call your function
     <?php custom_function_name(); ?>
     <script>
         $(document).ready(function() {
             $('#example').DataTable();
         });
     </script>
</head>

Answer 2

以下更改解决了问题：

更改index.php中的jQuery：

<script>
    $(document).ready(function() {
        $('#example').DataTable();
    });
</script>

以下内容：

<script>
    jQuery(document).ready(function() {
        $('#example').DataTable();
    });
</script>

WordPress没有调用默认的jQuery文件

2 个答案: