javascript 如何使用 jQuery 更新表格单元格值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5484992/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to update table cell value using jQuery
提问by m1k3y3
I am having problem updating table cell value using jQuery 1.4.2. it all works in Firefox and Safari but IE8 and IE9 is simply not doing anything. There is no warning, error or anything that would give me some hint where to look for it.
我在使用 jQuery 1.4.2 更新表格单元格值时遇到问题。这一切都适用于 Firefox 和 Safari,但 IE8 和 IE9 根本没有做任何事情。没有警告、错误或任何可以给我一些提示在哪里寻找它的东西。
Table looks following:
表如下:
<table id="test">
<tr id="1">
<td id="name">sample name</td>
<td id="schedule">sample value</td>
<td id="day">sample value</td>
</tr>
<tr id="2">
<td id="name">sample name</td>
<td id="schedule">sample value</td>
<td id="day">sample value</td>
</tr>
<tr id="3">
<td id="name">sample name</td>
<td id="schedule">sample value</td>
<td id="day">sample value</td>
</tr>
</table>
I am executing ajax call and getting json data:
我正在执行 ajax 调用并获取 json 数据:
{"Test": [
{"id":"1", "name":"John", "day":"Monday"},
{"id":"2", "name":"Marry", "day":"Thursday"}
]}
once data is received there is a loop which iterates through the json dataset and updates appropriate column with received data as following:
一旦接收到数据,就会有一个循环遍历 json 数据集并使用接收到的数据更新相应的列,如下所示:
$.each(json.Tests, function(){
/* update test with details */
var test = this.hash;
/*set values for each test */
$("table#test tr[id=" + test + "]").find("#name").html(this.name);
$("table#test tr[id=" + test + "]").find("#schedule").html(this.status);
$("table#test tr[id=" + test + "]").find("#day").html(this.changed);
});
As I mentioned, this has been tested in Safari and Firefox all works fine but IE8 and IE9 seems not to do anything.
正如我所提到的,这已经在 Safari 和 Firefox 中进行了测试,一切正常,但 IE8 和 IE9 似乎没有做任何事情。
回答by Craig
I think the id attribute should be reserved for unique identifiers in my opinion. How about changing the id attribute of the td elements to a class attribute or even name attribute. I suspect that IE is getting confused.
我认为 id 属性应该是为唯一标识符保留的。如何将 td 元素的 id 属性更改为 class 属性甚至 name 属性。我怀疑 IE 变得混乱了。
Also, if you keep ids unique and change the id attribute of the td to a class then you can change your code to something like:
此外,如果您保持 ids 唯一并将 td 的 id 属性更改为一个类,那么您可以将代码更改为:
$("#" + test + " td.name").html(this.name);
And because a number could represent pretty much anything also prefixing those ids with some sort of identifier prefix would be good. Something like:
并且因为一个数字几乎可以代表任何东西,所以在这些 id 前面加上某种标识符前缀会很好。就像是:
$("#thing-" + test + " td.name").html(this.name);
And the html would look like this:
html 看起来像这样:
<table id="test">
<tr id="thing-1">
<td class="name">sample name</td>
<td class="schedule">sample value</td>
<td class="day">sample value</td>
</tr>
<tr id="thing-2">
<td class="name">sample name</td>
<td class="schedule">sample value</td>
<td class="day">sample value</td>
</tr>
<tr id="thing-3">
<td class="name">sample name</td>
<td class="schedule">sample value</td>
<td class="day">sample value</td>
</tr>
</table>
Hope that helps!
希望有帮助!
回答by kgiannakakis
Ids aren't supposed to start with a number. Perhaps IE9 isn't as forgiving as the other browsers.
Id 不应该以数字开头。也许 IE9 不像其他浏览器那样宽容。
回答by Phillip Plum
Have you an URL for us to Test your Script?
你有一个 URL 供我们测试你的脚本吗?