使用ajax向tr添加另一个页面后表格的列宽发生变化答案

【问题标题】：Table's columns width changes after adding another page to tr using ajax使用ajax向tr添加另一个页面后表格的列宽发生变化
【发布时间】：2013-04-11 06:42:14
【问题描述】：

我有一个很难解释的问题希望你能理解并帮助我，我有一个动态生成行的表格，当按下一行时它会显示一个包含一些信息的页面，问题是当我按下在行和信息页面上显示列的宽度发生变化，整个表格移动（所有宽度）。我注意到它发生在加载信息页面后，但不知道为什么......

代码：这是我张贴表格的地方：

echo "<table border=\"0\" width=\"100%\" cellspacing=\"0\" align=\"center\" class=\"result_table\" id=\"result_table\">

<tr align=\"right\" bgcolor=\"red\">
<th bgcolor=\"#cccccc\" align=\"right\" >עיר</th>
<th bgcolor=\"#cccccc\" >רחוב</th>
<th bgcolor=\"#cccccc\" >מספר בית</th>
<th bgcolor=\"#cccccc\" >מחיר</th>
</tr>"; 
foreach($types as $data){               
echo $data['id'];
echo "<tr onClick=\"waiting_for_post(".$data['id'].");\" 
class=\"search_row\">";
echo "<td align=\"right\" width=\"25%\">";
echo $data['city'];
    echo "</td>";
echo "<td align=\"right\">";
echo $data['street'];
echo "</td>";
echo "<td align=\"right\">";
echo $data['house'];
    echo "</td>";
echo "<td align=\"right\">";
echo $data['price'];
echo "</td></tr>";
echo "<tr class=\"info_row\" style=\"width:100%\"><td colspan=\"4\"><div id=\"div_num_".$data['id']."\" style=\"height:0px\" ></div></td></tr>";

function waiting_for_post(apart_id){
var div = document.getElementById("div_num_"+apart_id)
var xmlhttp = createXmlHttpRequestObject();

xmlhttp.onreadystatechange=function()
{
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
   {

     var responseText = xmlhttp.responseText;

     div.innerHTML = responseText;
        div.style.visibility = 'visible';
        div.style.height= "225px";
        div.style.width="100%";
   }
}
xmlhttp.open("GET","publish_data.php?id="+apart_id,true);
xmlhttp.send(); 

}

【问题讨论】：

标签： javascript html ajax html-table width

【解决方案1】：

列的宽度会随着内容的变化而变化，因为你设置了“width:100%”，使用固定宽度可能会解决问题，并尝试估计最大宽度。

【讨论】：

谢谢，将宽度设置为固定宽度解决了我的问题。