6

WebサイトフォームにDataTablesを実装しようとしています。私はそれでいくつかの問題を経験していたので、一歩下がって、非常に基本的なテーブルにDataTablesを実装しようとしました。私が使用したテーブルは、http：//www.datatables.net/usage/から直接取得したものです。次に、必要だと思ったファイルを呼び出しましたが、この基本的なテーブルでもDatatablesを機能させることができません。私は何が欠けていますか？「練習」コードは次のとおりです。

 <script type="text/javascript" charset="utf-8" src="/media/js/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="/media/js/jquery.dataTables.js"></script>
<!--<script type="text/javascript" charset="utf-8" src="/media/src/DataTables.js"></script>-->

    <script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
    $('#table').dataTable();
    } );
    </script> 
    <style type="text/css" title="currentStyle">
        @import "/media/css/jquery.dataTables.css";
    </style>
    <title>Untitled Document</title>

</head>


    <table id="table" class="display">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>etc</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
            <td>etc</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
            <td>etc</td>
        </tr>
    </tbody>
</table>
<body>
</body>
</html>

ありがとう！

4

3 に答える 3

5

jsファイルとcssファイルは実際にロードされていますか？これは、FirefoxのFirebugまたはWebkitブラウザの開発ツールでデバッグできます。（テーブルを右クリックして、[要素の検査]を選択します）

また、DataTablesはMicrosoftAjaxCDNで利用できます。jQueryと同じ

外部リンクを使用して、機能するかどうかを確認できます。このような：

<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"/>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>

また、外部ライブラリを使用することをお勧めします。

于 2012-12-05T22:21:30.737 に答える
0

jQueryが最初にロードされるかどうかを確認します。次に、dataTablesアセットが機能しているかどうかを確認します。内部スタイルシート内で@importを使用する代わりに、アラート機能を使用して確認できます。

<link rel="stylesheet" type="text/css" href="filepath/style.css">

私のブログでは、Datatablesを使用するための手順やその他のオプションを確認できます。

于 2018-03-11T09:59:09.133 に答える
0

スクリプトに1つの属性「defer」を追加する必要があります。

<script src = "http://cdn.datatables.net/1.10.18/js/jquery.dataTables.min.js" defer ></script>
于 2021-05-26T20:30:56.890 に答える