[英]how do I get these query results into a table
这是HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
<meta name="dcterms.created" content="Tue, 03 May 2016 17:18:33 GMT">
<meta name="description" content="">
<meta name="keywords" content="">
<title></title>
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCqkH9U10wjgseSMBV07LmZETO5VQOT1Lw &callback=initMap"></script>
<body>
<div id="map" style="height:400px"></div>
<div id="status"></div>
<div id="results"</div>
<div id="stdiv"></div>
<div id="midiv"></div>
<div id="myray"></div>
</div>
<div style=" text-align: left; text-indent: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;"><table width="40%" border="1" cellpadding="2" cellspacing="2" style="border-color: #000000; border-style: solid; background-color: #ffffff;">
<tr valign="top">
<td id= "state" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"><br />
</td>
<td id= "mile" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"><br />
</td>
</tr>
<tr valign="top">
<td id="state" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"><br />
</td>
<td id="mile" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"><br />
</td>
</tr>
</table>
</div>
这是Javascript的一部分
for(state in stateMiles)
{
//$("#results").append("<br>"+state+":"+stateMiles[state]);
$("#stdiv").append("<br>"+stateMiles[state]);
//query results for number of Miles
$("#midiv").append("<br>"+state);
}
//query results for 2 letter abbreviation of state
document.getElementById("stdiv").innerHTML;//this shows the state only on the screen
document.getElementById("midiv").innerHTML;//this shows the mi. only on the screen
//我用2个get元素来分隔数据字符串。 //现在只是无法弄清楚如何将它放入一个表中,每个表都在自己的单元格中
我不知道你的数据是如何设置的,但是你可以做这样的事情。
window.onload = function() { var stateMiles = {Delaware: "16", Florida: "247"}; var table, tableData; // open table tag table = "<table>"; // fill table for(state in stateMiles) { tableData = "<tr><td>" + state + "</td>" + "<td>" + stateMiles[state] + "</td></tr>"; table = table + tableData; } // close table tag table = table + "</table>"; // write table into div document.getElementById('tabledata').innerHTML = table; }
<div id="tabledata"></div>
浏览器中的输出如下所示:
<div id="tabledata">
<table>
<tr>
<td>Delaware</td>
<td>16</td>
</tr>
<tr>
<td>Florida</td>
<td>247</td>
</tr>
</table>
</div>
首先,我在你的HTML代码中发现了一些错误。 下面是更新的代码
<div id="map" style="height:400px"></div>
<div id="status"></div>
<div id="results"></div>
<div id="stdiv"></div>
<div id="midiv"></div>
<div id="myray"></div>
<div style=" text-align: left; text-indent: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;">
<table width="40%" border="1" cellpadding="2" cellspacing="2" style="border-color: #000000; border-style: solid; background-color: #ffffff;">
<tr valign="top">
<td id= "state" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="state1"><br />
</td>
<td id= "mile" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="mile1"><br />
</td>
</tr>
<tr valign="top">
<td id= "state" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="state2"><br />
</td>
<td id= "mile" style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="mile2"><br />
</td>
</tr>
</table>
</div>
现在jQuery代码将是
var txt = "";
var i = 0;
for(state in stateMiles)
{
i++;
$("#results").append("<br>"+state+":"+stateMiles[state]);
$(".state"+i).append(stateMiles[state]);
$(".mile"+i).append(state);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.