繁体   English   中英

如何将这些查询结果放入表中

[英]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.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM