1, there are such a section of HTML
Copy Code code as follows:
<div class= "Right" id= "Pending" >
<table class= "One" width= "100%" border= "0" cellspacing= "0" cellpadding= "0" >
<tbody>
</tbody>
</table>
<div id= "Pendingpage" class= "Paging" >
</div>
</div>
2, I use jquery to dynamically populate the content code under Tbody as follows
Copy Code code as follows:
$ ("#pending table Tbody"). Empty (). append (Th). append (HTML);
This code is problematic in IE7 and the following IE versions, and jquery cannot find the correct DOM location and append content through the #pending table tbody. Need to modify, the modified code is as follows
Copy Code code as follows:
$ ("Table Tbody"). Empty (). append (Th). append (HTML);
Get rid of the #pending and get the DOM directly through table tbody.
3, I was very confused, the Cascade selector is very common, but under the IE7 why there is such a problem, is it a jquery bug or div under the nested table tbody HTML writing is not enough standard?
Let's go on to add:
Problems needing attention in using append in IE by jquery
$ (document). Ready (function () {
$.ajax ({
URL: ' cutepage.htm ',
dataType: ' JSON ',
data: ' Type=init &pagesize= ' + eachpage + ' &pageindex=1 ',
success:function (msg) {
//Can not be displayed under the IE7, no problem under Firefox ...
$ (' #Content '). Append (' <tr><td width= "19%" > Item number </TD><TD width= "15%" > Product name </td> <TD width= "20%" > Supplier number </td><td width= "30%" > Product category number </TD><TD width= "10%" > Price </td> </tr> ');
error:function (x) {alert ("Server error code:" + x.status); $ (' #Loading '). Hide (); }
});
});
Modified (as follows):
$ (document). Ready (function () {
$.ajax ({
URL: ' cutepage.htm ',
dataType: ' JSON ',
data: ' Type=init &pagesize= ' + eachpage + ' &pageindex=1 ',
success:function (msg) {
//modified ... (This will not be a problem, you can see that jquery is more sensitive to HTML tags, you need to pay attention later ...) )
var pagecontent = ';
PageContent = ' <table border= ' 2 ' > ';
PageContent + + <tr><td width= "19%" > Item number </TD><TD width= "15%" > Product name </TD><TD width= " 20% "> Supplier number </td><td width=" 30% "> Product category Number </TD><TD width=" > Unit price </td></tr> ";
PageContent + = ' </table> ';
$ (' #Content '). Append (PageContent);
},
error:function (x) {alert ("Server error code:" + x.status); $ (' #Loading '). Hide (); }
});
});
is to copy the content to an argument and not to use HTML content directly.
JQuery's Append method does not support the resolution of HTML attributes such as joins
is very depressed, write the program today, want to append some HTML in the Document object, such as <b><p> these are completely no problem, but encountered with the link HTML such as:
Copy Code code as follows:
$ ("#test"). Append ("<a href= ' >test</a>");
Firefox is no problem, IE6, IE7 has been to IE8 on the dead and alive, only display text content, without any connection. Ready to Google, but found Google.com has been unable to land, google.cn query out of the basically a page is the collection station of those rubbish articles, is very depressed. For a long time, to find an article, that is jquery's own append function of the problem, this function with similar HTML parsing and analysis of the statement, the basic HTML is no problem, hit the link or not completely closed the label or a custom label, jquery will not recognize the dead or alive. Do not know whether this is true, the JS library on hand is compressed version, too late head also sleepy don't want to see them source code. Create a tag directly by yourself insert the element into the well, do this:
Copy Code code as follows:
$ (document.createelement (' a ')). attr ({"href": "#", "id": ' #mylink '}). Appendto ("#test");
Then attach the content to this link:
Copy Code code as follows:
$ (' #mylink '). Text ("Test");
Hey, tired not tired ah. No matter, sleep, tomorrow is free to see the jquery source code is how to write it.