jQuery清理HTML表格答案

【问题标题】：jQuery cleaning HTML tablejQuery清理HTML表格
【发布时间】：2011-11-20 06:42:02
【问题描述】：

这是我的桌子：

        <tr class=stuff>
            <td id=id></td>
            <td id=city_id></td>
            <td id=temp></td>
            <td id=date></td>
        </tr>

这是我的 Javascript：

<script>
    $(document).ready(function() { // waits when document is ready
        $('.data').change(function() { // when dropbox value changes do this
            getWeather(); // here I tried inserting table clearing code
        });
    });

    function getWeather() {
        $.getJSON('getTemperature/' + $('.data option:selected').val(), null, function(data) { // JSON request
            $("#id").text(data.id); // changes fields accordingly
            $("#city_id").text(data.city_id);   
            $("#temp").text(data.temperature);  
            $("#date").text(data.date); 
        });
    }
 </script>

下拉菜单中的每个项目都没有来自服务器的响应，所以我希望它在发出新的 JSON 请求之前清除表。所以当 JSON 有数据返回时，数据会相应更新，但是当 JSON 没有任何数据返回时，所有的表都会是空的。

在 JSON 没有检索到数据的那一刻，旧数据仍然保留在表中。

我尝试使用 $('.stuff').remove() 和 $('.stuff').clean() ，但在 getWeather(); 之前使用它们之后，后来我无法将信息放入从 JSON 收到的表中。它只是不再起作用了。

如有任何问题，请随时提出。

【问题讨论】：

尝试改变事件是否被触发。
是的，因为 getWeather() 是。

标签： javascript jquery html json html-table

【解决方案1】：

试试这个

$('.stuff td').text("");
getWeather();

【讨论】：

哇哈哈，这工作，多么容易..我想知道为什么 .remove() 没有工作。
@Jaanus: remove() 有效，但它会从 DOM 中删除整个 <tr>，并且由于您没有重新创建它，因此所有后续函数调用都会失败。

【解决方案2】：

根据您将在您的网站上执行的此类操作的多少，您可能希望查看KnockoutJS，它专为具有变化数据的动态显示而设计，包括自动隐藏部分。

【讨论】：