Posts
There is a curious probelm between for and foreach.
When I get a collection by 'document.getElementsByTagName', and iterate it's items.
In i.e., javascript will get undefined object created by server code when using foreach. why?
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Test foreach</title>
<script type="text/javascript" language="javascript">
function newRow(){
var container = document.getElementById("container");
var input = document.createElement("input");
var div = document.createElement("div");
input.type = "text";
input.name = "foption";
input.value = (new Date()).toGMTString();
div.appendChild(input);
container.appendChild(div);
}
function foreachResult(){
var result = document.getElementById("result");
var inputs = document.getElementsByTagName("input");
var div = false;
while(result.firstChild) result.removeChild(result.firstChild);
for(var i in inputs){
if(!inputs[i] || inputs[i].name != "foption") continue;
div = document.createElement("div");
div.appendChild(document.createTextNode(inputs[i] ? inputs[i].value : "undefined inputs?"));
result.appendChild(div);
}
}
function forResult(){
var result = document.getElementById("result");
var inputs = document.getElementsByTagName("input");
var div = false;
while(result.firstChild) result.removeChild(result.firstChild);
for(var i = 0; i < inputs.length; i++){
if(!inputs[i] || inputs[i].name != "foption") continue;
div = document.createElement("div");
div.appendChild(document.createTextNode(inputs[i] ? inputs[i].value : "undefined inputs?"));
result.appendChild(div);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
<table border="1">
<tr>
<td>
<div id="container">
<input type="button" onclick="newRow();" value="加入textbox" /><br />
<input type="button" onclick="foreachResult();" value="用利foreach列出name為foption的textbox" /><br />
<input type="button" onclick="forResult();" value="用利for列出name為foption的textbox" />
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</div>
</td>
<td style="width: 300px; vertical-align: top;">
<div id="result">
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
Default.aspx.cs
using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Text;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder();
for (int i = 0; i < 15; i++)
{
sb.AppendFormat("<div><input type=\"text\" name=\"foption\" value=\"{0}\" /></div>", i);
}
Literal1.Text = sb.ToString();
}
}
