Question

我一直在尝试使用此表设置此表。 http://www.ajaxblender.com/demos/tables/sortabletable/

我用我的浏览器检查过，页面正确地拉了css和.js文件，但它在引用我的sortabletable.js文件时给了我这个错误

（错误的屏幕截图） http://i.imgur.com/iJa2Rz8.png

以下是源代码

的相关部分的副本

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
  <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/>
  <title>Home page</title>
  <link rel="stylesheet" href="./_common/css/main.css" type="text/css" media="all">

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

<script type="text/javascript" src="./_common/js/mootools.js"></script>
<script type="text/javascript" src="sortableTable.js"></script>


</head>
<body>

<div id="container">
<div id="example">
        <div class="tableFilter">
            <form id="tableFilter" onsubmit="myTable.filter(this.id);     return false;">Filter: 
                <select id="column">
                    <option value="1">Firstname</option>
                    <option value="2">Lastname</option>
                    <option value="3">Department</option>
                    <option value="4">Start Date</option>
                </select>
                <input type="text" id="keyword" />
                <input type="submit" value="Submit" />
                <input type="reset" value="Clear" />
            </form>
      </div>
      <table id="myTable" cellpadding="0" cellpadding="0">
        <thead>
            <th axis="number">ID</th>
            <th axis="string">Firstname</th>
            <th axis="string">Lastname</th>
            <th axis="string">Department</th>
            <th axis="date">Start Date</th>
        </thead>
        <tbody>
            <tr id="1">
                <td class="rightAlign">1</td>
                <td>Sam</td>
                <td>Birch</td>
                <td>Programming</td>
                <td class="rightAlign">01/06/00</td>
            </tr>
            <tr id="2">
                <td class="rightAlign">2</td>
                <td>George</td>
                <td>Lo</td>
                <td>Support</td>
                <td class="rightAlign">01/07/99</td>
            </tr>
            <tr id="3">
                <td class="rightAlign">3</td>
                <td>kevin</td>
                <td>Walker</td>
                <td>Programming</td>
                <td class="rightAlign">01/06/05</td>
            </tr>
            <tr id="4">
                <td class="rightAlign">4</td>
                <td>Peter</td>
                <td>Aland</td>
                <td>Project Management</td>
                <td class="rightAlign">23/10/06</td>
            </tr>
            <tr id="5">
                <td class="rightAlign">5</td>
                <td>Rachel</td>
                <td>Dickinson</td>
                <td>Design</td>
                <td class="rightAlign">20/01/05</td>
            </tr>
            <tr id="6">
                <td class="rightAlign">6</td>
                <td>John</td>
                <td>Tsang</td>
                <td>Support</td>
                <td class="rightAlign">05/10/05</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tfoot>
      </table>


    <script type="text/javascript">
        var myTable = {};
        window.addEvent('domready', function(){
            myTable = new sortableTable('myTable', {overCls: 'over', onClick: function(){alert(this.id)}});
        });
    </script>
    </div>


</div>
</div>
</body>
</html>

对它可能是什么的任何想法？

Answer 1

使用$.find('tbody')获取所有后代tbody和$.children('tbody')以获取所有子级tbody。试试这个：

this.thead = this.table.children('thead');
this.tbody = this.table.children('tbody');
this.tfoot = this.table.children('tfoot');
this.elements = this.table.find('tr');

Answer 2

Altough我没有看到你的HTML示例中加载了jQuery，你的问题标题表明你在你的网站中使用了jQuery。如果是这种情况，那么你的问题就是Mootools和jQuery之间存在冲突，因为两个库都定义了$函数。要解决此问题，您必须使用jQuery.noConflict()。

Jquery Object＃<object>没有方法'getElement'</object>

2 个答案: