First look at a code, I am using Expression with Expression with Expression to achieve the problem of the problem (indicate: the expression of Expression usage in the style is only IE browser support!):
expression vs XML data </ title> <style type = 'text / css' > .mm Tr {background-color: expression ((this.rowIndex% 2 == 0)? "# 00ff33": "# ccff33")} </ stop></p>
<p><xml id = 'xmldata'> <? XML version = "1.0" encoding = "GB2312"?> <rows> <row> <id> 1 </ id> <area> web development / non-technical zone </ area> <Trend> ↑ </ TREND> <percent> 67.23% </ percent> </ row> <row> <id> 2 </ id> <area> C / C / C language </ area> <trend> ↑ < / TREND> <percent> 14.35% </ percent> </ row> <row> <id> 3 </ id> <area> Delphi / non-technical zone </ area> <trend> ↑ </ trend> <percent> 13.88% </ percent> </ row> <row> <id> 4 </ id> <area> Oracle / foundation and management </ area> <percent> 11.87% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 5 </ id> <area> Windows Zone / Windows NT / 2000 / XP / 2003 </ area> <percent> 8.33% </ percent> <trend> ↑ </ trend> </ row> <row> <ID> 6 </ id> <area> .NET Technology / Non - technical zone </ area> <percent> 7.32% </ percent> <trend> ↓ </ trend> </ row> <ROW> <ID> 7 </ ID> <area> Web Development / JavaScript </ area> <percent> 7.24% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 8 </ id> <area> VC / MFC / Foundation class </ area> <percent> 4.80% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 9 </ id> < Area> Java / J2EE / EJB / JMS </ area> < Percent> 3.00% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 10 </ id> <area> expansion topic / Irrigation Park </ area> <</p>
<p>Percent> 1.75% </ percent> <trend> ↓ </ trend> </ row> </ rows> </ xml> </ head> <body> <table class = "mm" id = "tab" datasrc = ' #Xmldata 'border =' 1 '> <tr> <td> <div DataFld =' id '> </ div> </ td> <td> <div datafld =' area '> </ div> </ td> <TD> <Div DataFld = 'Trend'> </ div> </ td> <td> <div DataFld = 'percent'> </ div> </ td> </ tr> </ table></p>
<p><hr></p>
<p>Below this form is a test form to test the code accuracy of Expression in the test style.</p>
<p><table class = "mm" border = '1'> <tr> <td> <div> 1111 </ div> </ td> <td> <div> 2222 </ div> <td> <td> < Div> 3333 </ div> </ td> <td> <div> 4444 </ div> <td> <div> 2222 </ div> <div> 2222 </ div> </ td> <TD > <div> 2222 </ div> </ td> <td> <div> 3333 </ div> </ td> <td> <div> 4444 </ div> </ td> </ tr> <tr> <TD> <div> 3333 </ div> </ td> <TD> <div> 2222 </ div> <td> <td> <div> 3333 </ div> </ td> <td> <div> <div > 4444 </ div> </ td> <div> <tr> <td> <div> 4444 </ div> </ td> <td> <div> 2222 </ div> </ td> <td> <div> 3333 </ div> </ td> <TD> <DIV> 4444 </ div> </ td> </ tr> </ table> </ body> </ html> can see the test results, A form does not reach the interlaced effect I originally wanted! Is there a problem with the style? Obviously, because the second table is normally displayed. I analyze this problem may be related to the presence of rendering. That is, before the data binding, only one line in the form, the CSS has the background color rendering of the table, and then the data binding operation, (I don't know if the rendering effect of this first line is still expression, I don't recognize the Later, it is still What are the rest of the renewed, in turn, the line continued to extends the style of the first line.</p>
<p>To this end, I made a adjustment, that is, after the style rendering is binding, I add a little code in the OnLoad event in <body>. Look at the code effect:</p>
<p><html> <head> <meta http-equiv = "Content-type" content = "text / html; charSet = GB2312" /> <title> expression vs XML data </ title> <style type = 'text / css' > .mm Tr {background-color: expression ((this.rowIndex% 2 == 0)? "# 00ff33": "# ccff33")} </ stop></p>
<p><xml id = 'xmldata'> <? XML version = "1.0" encoding = "GB2312"?> <rows> <row> <id> 1 </ id> <area> web development / non-technical zone </ area> <Trend> ↑ </ TREND> <percent> 67.23% </ percent> </ row> <row> <id> 2 </ id> <area> C / C / C language </ area> <trend> ↑ < / TREND> <percent> 14.35% </ percent> </ row> <row> <id> 3 </ id> <area> Delphi / non-technical zone </ area> <trend> ↑ </ trend> <percent> 13.88% </ percent> </ row> <row> <id> 4 </ id> <area> Oracle / foundation and management </ area> <percent> 11.87% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 5 </ id> <area> Windows Zone / Windows NT / 2000 / XP / 2003 </ area> <percent> 8.33% </ percent> <trend> ↑ </ trend> </ row> <row> <ID> 6 </ id> <area> .NET Technology / Non - technical zone </ area> <percent> 7.32% </ percent> <trend> ↓ </ trend> </ row> <ROW> <ID> 7 </ ID> <area> Web Development / JavaScript </ area> <percent> 7.24% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 8 </ id> <area> VC / MFC / Foundation class </ area> <percent> 4.80% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 9 </ id> < Area> Java / J2EE / EJB / JMS </ area> < Percent> 3.00% </ percent> <trend> ↑ </ trend> </ row> <row> <id> 10 </ id> <area> expansion topic / Irrigation Park </ area> <</p>
<p>Percent> 1.75% </ percent> <trend> ↓ </ trend> </ row> </ rows> </ xml> </ head> <body οnlοad = "Document.getElementByid ('tab'). ClassName = 'mm '"> <Table ID =" Tab "Datasrc =' # xmldata 'border =' 1 '> <tr> <td> <div DataFLD =' ID '> </ div> </ td> <td> <div datafld = 'Area'> </ div> </ td> <TD> <Div DataFLD = 'TREND'> </ div> </ td> <td> <div datafld = 'percent'> </ div> </ td > </ TR> </ table></p>
<p><hr></p>
<p>Below this form is a test form to test the code accuracy of Expression in the test style.</p>
<p><table class = "mm" border = '1'> <tr> <td> <div> 1111 </ div> </ td> <td> <div> 2222 </ div> <td> <td> < Div> 3333 </ div> </ td> <td> <div> 4444 </ div> <td> <div> 2222 </ div> <div> 2222 </ div> </ td> <TD > <div> 2222 </ div> </ td> <td> <div> 3333 </ div> </ td> <td> <div> 4444 </ div> </ td> </ tr> <tr> <TD> <div> 3333 </ div> </ td> <TD> <div> 2222 </ div> <td> <td> <div> 3333 </ div> </ td> <td> <div> <div > 4444 </ div> </ td> <div> <tr> <td> <div> 4444 </ div> </ td> <td> <div> 2222 </ div> </ td> <td> <div> 3333 </ div> </ td> <td> <div> 4444 </ div> </ td> </ tr> </ table> </ body> </ html> results prove that my original idea This can be seen that the cooperation between IE style Expression and XML data island bindings is not very tacit!</p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-131330.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>)
</div><div></div></div></div><ul class="postlist list-unstyled">
</ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="131330" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved
</div><div class="col text-right">Processed:
<b>0.049</b>, SQL:
<b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script>
var debug = DEBUG = 0;
var url_rewrite_on = 1;
var url_path = './';
var forumarr = {"1":"Tech"};
var fid = 1;
var uid = 0;
var gid = 0;
xn.options.water_image_url = 'view/img/water-small.png';
</script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script>
var forum_url = 'list-1.html';
var safe_token = 'nb3WfIm_2FV4ux75JudBB8CbyFvOr_2Fvmth5sJzJLHC2ne4vvriZCwGkdAYQZsD6R3LXJyfkG9nhthw4o18';
var body = $('body');
body.on('submit', '#form', function() {
var jthis = $(this);
var jsubmit = jthis.find('#submit');
jthis.reset();
jsubmit.button('loading');
var postdata = jthis.serializeObject();
$.xpost(jthis.attr('action'), postdata, function(code, message) {
if(code == 0) {
location.reload();
} else {
$.alert(message);
jsubmit.button('reset');
}
});
return false;
});
function resize_image() {
var jmessagelist = $('div.message');
var first_width = jmessagelist.width();
jmessagelist.each(function() {
var jdiv = $(this);
var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width();
var jmessage_width = Math.min(jdiv.width(), maxwidth);
jdiv.find('img, embed, iframe, video').each(function() {
var jimg = $(this);
var img_width = this.org_width;
var img_height = this.org_height;
if(!img_width) {
var img_width = jimg.attr('width');
var img_height = jimg.attr('height');
this.org_width = img_width;
this.org_height = img_height;
}
if(img_width > jmessage_width) {
if(this.tagName == 'IMG') {
jimg.width(jmessage_width);
jimg.css('height', 'auto');
jimg.css('cursor', 'pointer');
jimg.on('click', function() {
});
} else {
jimg.width(jmessage_width);
var height = (img_height / img_width) * jimg.width();
jimg.height(height);
}
}
});
});
}
function resize_table() {
$('div.message').each(function() {
var jdiv = $(this);
jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>');
});
}
$(function() {
resize_image();
resize_table();
$(window).on('resize', resize_image);
});
var jmessage = $('#message');
jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); });
jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); });
$('#nav li[data-active="fid-1"]').addClass('active');
</script>
