62,073
社区成员
发帖
与我相关
我的任务
分享document .getElementById （）读取服务端控件能使用变量吗
在.aspx文件的js中，访问ASP.NET服务器控件的方法如下：var document.getElementById("<%=tb_Name1.ClientID%>")，我现在有文本框tb_Name1,tb_Name2。。。可否将变量赋到文本框？？ 客户端Html控件我试了可以，写法是document.getElementById("" + TextBoxId + ""); 求解答？tb_Name1是要在js里是验证该控件是否存在的
...全文
请发表友善的回复…
发表回复
一生何求 2018-09-12
- 打赏
- 举报
谢谢大家，意思是除了翻书学习没有太好的办法是吗？还是得按笨办法，写不了循环是吧 没办法就结贴了 再次感谢
独立观察员 2018-09-05
- 打赏
- 举报
服务器控件和 Html 控件加入静态 Id_BXxx_新浪博客 http://blog.sina.com.cn/s/blog_603e393e0100zwfu.html
首先需要把项目改成 asp.net4.0, 因为要用到的属性是 4.0 的，就是设置内容区域的 ClientIDMode 属性，设置成 static 即可，具体详情如下：
在 ASP.NET 4.0 之前我们总是要为控件的 ClientID 头疼，比如明明一个叫 lblName 的 Label 放在一个叫做 grd 的 GridView 里面后，在页面上改 Label 的 ID 就变成了诸如 grd_clt02_lblName 的一长串字符串，如果我们在前台想在使用 JS 的时候找到该 Label，我们不得不用到 C# 脚本来获得该 Label 在前台的确切 ID，诸如：
<script type="text/javascript">
var lblName = document.getElementByIdx_x("<%=lblName.ClientID %>");
</script>
附
getElementByIdx_x() 为自定义函数：
document.getElementByIdx_x = function(id){
if(typeof id == 'string')
return document.getElementById(id);
else
throw new error('please pass a string as a id!')
}
在 ASP.NET 4.0 中的每个控件上都多了一个叫做 ClientIDMode 的属性，这就是解决上面获取控件 ID 难的解决方案。这个属性有四个可选值，根据所选值的不同它可以控制页面上生成控件的 ID 格式。
下面就让我们来了解下 ClientIDMode 属性的四个值：
1，AutoID:
当控件的 ClientIDMode 选中为 AutoID 时，该控件的 ClientID 值是通过串联每个祖先容器控件（诸如 GridView、ListView、LoginView 等就是容器性控件）的 ID 和父容器控件的 ID 和其本身的 ID 值生成的，当然如果该控件没有在任何容器控件中其 ClientID 值就是其本身的 ID 值，不会做任何更改。 另外如果该控件所在的父容器控件或祖先容器控件有些是显示多个数据行的容器控件（例如 GridView、ListView 就是显示多数据行的容器控件）， 那么还将在这些容器控件的 ID 值的后面会插入一个递增的行号格式。 各部分之间以下划线字符 (_) 分隔。 可见在 ASP.NET 4 之前的版本中使用的就是 AutoID 方案来生成控件的 ClientID 值。
比如下面这个 GridView 里面就有一个名叫 Label1 的 ID，我们将 Label1 的 ClientIDMode 设置为了 AutoID：
<asp:GridView ID="grd_Account" runat="server" AllowPaging="True"
AutoGenerateColumns="False"
DataKeyNames="Account Number" DataSourceID="sds_account" Height="63px"
Width="676px" PageSize="5" ClientIDMode="AutoID" >
<Columns>
<asp:TemplateField HeaderText="Account Number" SortExpression="Account Number">
<ItemTemplate>
<asp:Label ID="Label1" runat="server"
Text='<%# Bind("[Account Number]") %>' ClientIDMode="AutoID"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
该 GridView 生成的客户端 HTML 代码就是：
<table cellspacing="0" rules="all" border="1" id="grd_Account" style="height:63px;width:676px;border-collapse:collapse;">
<tr>
<th scope="col">Account Number</th>
</tr>
<tr>
<td>
<span id="grd_Account_ctl02_Label1">1060</span>
</td>
</tr>
<tr>
<td>
<span id="grd_Account_ctl03_Label1">1200</span>
</td>
</tr>
<tr>
<td>
<span id="grd_Account_ctl04_Label1">1510</span>
</td>
</tr>
</table>
可以看到 GirdView 里面的 Label 形成了诸如 grd_Account_ctl02_Label1 格式的 ClientID，而这正是：父容器 ID（grd_Account）+"_"+ 行号格式 (ctl02)+"_"+ 控件自身 ID（ClientID）这种格式生成的。
2，Static:
当控件的 ClientIDMode 选中为 Static 时，该控件的 ClientID 值就是其本身设置的 ID 属性值，其 ClientID 值不会受到父容器控件的影响。
比如我们把上面的代码稍作修改，将 Label1 的 ClientIDMode 属性改为 Static：
<asp:GridView ID="grd_Account" runat="server" AllowPaging="True"
AutoGenerateColumns="False"
DataKeyNames="Account Number" DataSourceID="sds_account" Height="63px"
Width="676px" PageSize="5" >
<Columns>
<asp:TemplateField HeaderText="Account Number" SortExpression="Account Number">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("[Account Number]") %>' ClientIDMode="Static"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
运行后查看得到的 HTML 代码：
<table cellspacing="0" rules="all" border="1" id="grd_Account" style="height:63px;width:676px;border-collapse:collapse;">
<tr>
<th scope="col">Account Number</th>
</tr><tr>
<td>
<span id="Label1">1060</span>
</td>
</tr><tr>
<td>
<span id="Label1">1200</span>
</td>
</tr><tr>
<td>
<span id="Label1">1510</span>
</td>
</tr>
</table>
看到了吗，GridView 里每行的 Label1 的 ClientID 都以自身 ID 的值出现了，不会受到父级容器控件的 ID 影响，这样在前台使用 JS 时我们就能通控件本身的 ID 值找到我们想要的控件了。
此外使用 Static 后势必页面中会出现很多同名的控件 ID，只要这些同名 ID 的控件处于页面的不同层次（比如某一容器控件的内部和外部就是不同层次）上那么就不会出现问题，但是如果页面同一层次上有多个同 ID 的控件，那么页面就会报错。
首先需要把项目改成 asp.net4.0, 因为要用到的属性是 4.0 的，就是设置内容区域的 ClientIDMode 属性，设置成 static 即可，具体详情如下：
在 ASP.NET 4.0 之前我们总是要为控件的 ClientID 头疼，比如明明一个叫 lblName 的 Label 放在一个叫做 grd 的 GridView 里面后，在页面上改 Label 的 ID 就变成了诸如 grd_clt02_lblName 的一长串字符串，如果我们在前台想在使用 JS 的时候找到该 Label，我们不得不用到 C# 脚本来获得该 Label 在前台的确切 ID，诸如：
<script type="text/javascript">
var lblName = document.getElementByIdx_x("<%=lblName.ClientID %>");
</script>
附
getElementByIdx_x() 为自定义函数：
document.getElementByIdx_x = function(id){
if(typeof id == 'string')
return document.getElementById(id);
else
throw new error('please pass a string as a id!')
}
在 ASP.NET 4.0 中的每个控件上都多了一个叫做 ClientIDMode 的属性，这就是解决上面获取控件 ID 难的解决方案。这个属性有四个可选值，根据所选值的不同它可以控制页面上生成控件的 ID 格式。
下面就让我们来了解下 ClientIDMode 属性的四个值：
1，AutoID:
当控件的 ClientIDMode 选中为 AutoID 时，该控件的 ClientID 值是通过串联每个祖先容器控件（诸如 GridView、ListView、LoginView 等就是容器性控件）的 ID 和父容器控件的 ID 和其本身的 ID 值生成的，当然如果该控件没有在任何容器控件中其 ClientID 值就是其本身的 ID 值，不会做任何更改。 另外如果该控件所在的父容器控件或祖先容器控件有些是显示多个数据行的容器控件（例如 GridView、ListView 就是显示多数据行的容器控件）， 那么还将在这些容器控件的 ID 值的后面会插入一个递增的行号格式。 各部分之间以下划线字符 (_) 分隔。 可见在 ASP.NET 4 之前的版本中使用的就是 AutoID 方案来生成控件的 ClientID 值。
比如下面这个 GridView 里面就有一个名叫 Label1 的 ID，我们将 Label1 的 ClientIDMode 设置为了 AutoID：
<asp:GridView ID="grd_Account" runat="server" AllowPaging="True"
AutoGenerateColumns="False"
DataKeyNames="Account Number" DataSourceID="sds_account" Height="63px"
Width="676px" PageSize="5" ClientIDMode="AutoID" >
<Columns>
<asp:TemplateField HeaderText="Account Number" SortExpression="Account Number">
<ItemTemplate>
<asp:Label ID="Label1" runat="server"
Text='<%# Bind("[Account Number]") %>' ClientIDMode="AutoID"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
该 GridView 生成的客户端 HTML 代码就是：
<table cellspacing="0" rules="all" border="1" id="grd_Account" style="height:63px;width:676px;border-collapse:collapse;">
<tr>
<th scope="col">Account Number</th>
</tr>
<tr>
<td>
<span id="grd_Account_ctl02_Label1">1060</span>
</td>
</tr>
<tr>
<td>
<span id="grd_Account_ctl03_Label1">1200</span>
</td>
</tr>
<tr>
<td>
<span id="grd_Account_ctl04_Label1">1510</span>
</td>
</tr>
</table>
可以看到 GirdView 里面的 Label 形成了诸如 grd_Account_ctl02_Label1 格式的 ClientID，而这正是：父容器 ID（grd_Account）+"_"+ 行号格式 (ctl02)+"_"+ 控件自身 ID（ClientID）这种格式生成的。
2，Static:
当控件的 ClientIDMode 选中为 Static 时，该控件的 ClientID 值就是其本身设置的 ID 属性值，其 ClientID 值不会受到父容器控件的影响。
比如我们把上面的代码稍作修改，将 Label1 的 ClientIDMode 属性改为 Static：
<asp:GridView ID="grd_Account" runat="server" AllowPaging="True"
AutoGenerateColumns="False"
DataKeyNames="Account Number" DataSourceID="sds_account" Height="63px"
Width="676px" PageSize="5" >
<Columns>
<asp:TemplateField HeaderText="Account Number" SortExpression="Account Number">
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("[Account Number]") %>' ClientIDMode="Static"></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
运行后查看得到的 HTML 代码：
<table cellspacing="0" rules="all" border="1" id="grd_Account" style="height:63px;width:676px;border-collapse:collapse;">
<tr>
<th scope="col">Account Number</th>
</tr><tr>
<td>
<span id="Label1">1060</span>
</td>
</tr><tr>
<td>
<span id="Label1">1200</span>
</td>
</tr><tr>
<td>
<span id="Label1">1510</span>
</td>
</tr>
</table>
看到了吗，GridView 里每行的 Label1 的 ClientID 都以自身 ID 的值出现了，不会受到父级容器控件的 ID 影响，这样在前台使用 JS 时我们就能通控件本身的 ID 值找到我们想要的控件了。
此外使用 Static 后势必页面中会出现很多同名的控件 ID，只要这些同名 ID 的控件处于页面的不同层次（比如某一容器控件的内部和外部就是不同层次）上那么就不会出现问题，但是如果页面同一层次上有多个同 ID 的控件，那么页面就会报错。
以专业开发人员为伍 2018-09-05
- 打赏
- 举报
不要自己发明什么、乱猜什么代码。你写
var aa = TextBoxId + ".ClientID";以专业开发人员为伍 2018-09-05
- 打赏
- 举报
asp.net 的机制是传统的网页机制，不是web 富客户端编程机制。这就好像我们说“后台开发人员”跟“前端开发人员”的本质区别，后台开发人员自认为学习前端技术“不现实”，所以其实是学不会！那么采用 asp.net 机制，你就得使用类似 UpdatePanel 那样的一遍遍提交处理整个页面状态、但是可能仅仅更新部分 html 的模式。不过这种模式其实并不能灵活处理前端 UI 操作细节，不过好在是有规范的 asp.net 教程去给你做培训。
以专业开发人员为伍 2018-09-05
- 打赏
- 举报
如果你调试 html/js 代码，你根本看不到 var document.getElementById("<%=tb_Name1.ClientID%>") 这类代码！你应该根据实际的调试来理解机制。
所以这个地方如果概念混乱，是一个坑人的陷阱。从最初的设计思路上就是没有按照设计的方式来描述。
所以这个地方如果概念混乱，是一个坑人的陷阱。从最初的设计思路上就是没有按照设计的方式来描述。
Logerlink 2018-09-04
- 打赏
- 举报
可以的
至于你说的 不使用变量，这样就不能用循环的方法
一般相似的东西，都可以利用class或者id来进行分组管理，像这样动态改变的值，尽量只让他作为显示，而不是对他进行操作
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ajaxTest.aspx.cs" Inherits="WebFirst.Content._201809.ajaxTest" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script>
window.onload = function () {
// number 请自行在后台定义为 public int number = 1;
console.log("btn_<%=number%>")
let value = document.getElementById("btn_<%=number%>").value = "已修改";
console.log(value)
}
</script>
</head>
<body>
<input type="button" id="btn_<%=number %>" value="获取">
</body>
</html>
至于你说的 不使用变量，这样就不能用循环的方法
一般相似的东西，都可以利用class或者id来进行分组管理，像这样动态改变的值，尽量只让他作为显示，而不是对他进行操作
mirrorspace 2018-09-04
- 打赏
- 举报
前后端不分啊.
这个过程是在前端使用JS修改值 后,传到后台服务
webfrom使用的是ajax的.
这个过程是在前端使用JS修改值 后,传到后台服务
webfrom使用的是ajax的.
threenewbee 2018-09-03
- 打赏
- 举报
document.getElementById(你的id).value = 值
注意，如果是服务器变量，那么它只能是你页面加载的时候的变量，如果要动态赋值，需要用ajax，或者刷新页面
注意，如果是服务器变量，那么它只能是你页面加载的时候的变量，如果要动态赋值，需要用ajax，或者刷新页面
正怒月神 版主 2018-09-03
- 打赏
- 举报
document.getElementById('<%=tb_Name1.ClientID%>').value = 值
记不清是value还是text了，你都试试吧。
记不清是value还是text了，你都试试吧。
一生何求 2018-09-03
- 打赏
- 举报
你说的对，我是半路出家，单位还有别的工作，很少学习，你提高的“那么你要描述自己的逻辑设计思路，必须用正规的学过asp.net 机制的语言来具体描述你的设计需求”，我的确是描述不出来
那我下一步怎么做，方法一：把asp.net控件全部该成HTML控件？似乎不现实，还有很多卡控，后台的一些东西：方法二：不使用变量，这样就不能用循环的方法，只能手工写？
那我下一步怎么做，方法一：把asp.net控件全部该成HTML控件？似乎不现实，还有很多卡控，后台的一些东西：方法二：不使用变量，这样就不能用循环的方法，只能手工写？
以专业开发人员为伍 2018-09-03
- 打赏
- 举报
<%= %> 这种 asp 语法是将近20年前就有的，它不是什么”在js中验证控件存在“的，你学着调试一下你的 html/js 实际的代码。
以专业开发人员为伍 2018-09-03
- 打赏
- 举报
按照教程来编程设计。如果没学过 asp.net 原理应该先学习（不要去垃圾培训学校学习asp.net，不要仅仅靠视频来胡乱学习 asp.net）。
以专业开发人员为伍 2018-09-03
- 打赏
- 举报
你从 html 中调试到过
js 不可能访问服务器控件。相反地，是 asp.net 编译器差生了纯粹的 html/js 代码。那么你要描述自己的逻辑设计思路，必须用正规的学过asp.net 机制的语言来具体描述你的设计需求。此时你所谓的”TextBoxId“的来龙去脉应该是说的明白的，不是连 tb_Name1 跟 tb_Name1.ClientID 都区别不出来的说法。
var document.getElementById("<%=tb_Name1.ClientID%>")js 不可能访问服务器控件。相反地，是 asp.net 编译器差生了纯粹的 html/js 代码。那么你要描述自己的逻辑设计思路，必须用正规的学过asp.net 机制的语言来具体描述你的设计需求。此时你所谓的”TextBoxId“的来龙去脉应该是说的明白的，不是连 tb_Name1 跟 tb_Name1.ClientID 都区别不出来的说法。
