如何在<%: %>中嵌入JS变量count？ASP.NET代码问题

你踩的坑其实是服务器端与客户端代码执行时机的核心差异，我来给你讲清楚原因并提供可行的解决方案：

为什么原来的代码行不通？ #

服务器端的<%:Givenome[count]%>是在页面渲染阶段（也就是服务器把页面发送给浏览器之前）执行的，这时候客户端的JS变量count还根本不存在——JS代码要等页面完全加载到浏览器之后才会运行。所以服务器会把count当成一个服务器端变量，自然找不到对应的定义，导致代码失效。

正确的解决思路 #

我们需要把服务器端的Givenome数组先转换成客户端JS能直接使用的数组，然后在JS里直接操作这个本地数组，这样就能用JS的count变量来索引了。

修改后的完整代码 #

C#后端代码

public string[] Givenome { get; set; }
// 新增属性，用来存储序列化后的JSON字符串
protected string GivenomeJson { get; set; }

protected void Page_Load(object sender, EventArgs e)
{
    string[] answers = new string[10] { "Y", "Y", "N", "Y", "N", "Y", "N", "Y", "N", "Y" };
    Givenome = answers;
    
    // 把C#数组序列化成JS能识别的JSON格式
    var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    GivenomeJson = serializer.Serialize(Givenome);
}

HTML/客户端JS代码

<table id="myTable">
  <tr>
    <td>Row1 cell1</td>
    <td>Row1 cell2</td>
  </tr>
</table>
<br>
<button type="button" onclick="myFunction()">Try it</button>

<script>
// 将服务器端传递过来的JSON字符串转换成JS数组
const givenomeArray = <%= GivenomeJson %>;

function myFunction() {
  const table = document.getElementById("myTable");
  
  // 直接使用JS数组的长度，无需再从服务器端获取Count()
  for (let count = 0; count < givenomeArray.length; count++) {
    const row = table.insertRow(0);
    const cell1 = row.insertCell(0);
    const cell2 = row.insertCell(1);
    
    // 直接访问本地JS数组的元素，此时count是客户端运行时变量，完全可用
    cell1.innerHTML = givenomeArray[count];
    cell2.innerHTML = "NEW CELL2";
  }
}
</script>

额外说明 #

这种方案的核心是提前完成服务器端到客户端的数据传递——把服务器端的数组序列化后嵌入到页面中，变成客户端可以直接操作的JS变量，彻底避免在客户端JS中试图调用服务器端代码的错误操作。

内容的提问来源于stack exchange，提问作者Fernando Filipe