控件检验分两步:选择和校验;对于服务器控件的选择,需要通过服务器id转换为客户端id之后,才能在js中操作。以下说明:
1 选择
html代码:
<body> 显示位置: <asp:DropDownList ID="channelSel" runat="server"> <asp:ListItem Value="" Selected>频道选择</asp:ListItem> <asp:ListItem Value="Pro_NoteBook">笔记本频道</asp:ListItem> <asp:ListItem Value="Pro_Camera">数码相机频道</asp:ListItem> <asp:ListItem Value="Pro_Desktop">台式机频道</asp:ListItem> … </asp:DropDownList> </body>
JS操作:
<script type="text/javascript"> function ValidDrpList(){ var chId = '<%=channelSel.ClientID %>'; var chSel = document.getElementById(chId).value; } </script>
使用ClientID属性转换为客户端ID,再通过document对象选中该元素;
2 校验
之后的校验没什么特别的,都一样:
<script type="text/javascript"> function ValidDrpList(){ var chId = '<%=channelSel.ClientID %>'; var chSel = document.getElementById(chId).value; if(chSel == ''){ alert("请选择频道"); return false; } return true; } </script>
3 独立js文件
只有在本页面中才可以使用ClientID属性,因此,为了独立js文件,我们需要将ID值的转换与选择校验操作分离开来:
<script type="text/javascript"> function getNetID() { var proID = '<%=ProBtn.ClientID %>';//.net控件:用户名输入框 var couID='<%=CBtn.ClientID %>';//.net控件:密码输入框 var sellerID='<%=SBtn.ClientID %>'; return {Id1:proID,Id2:couID,Id3:sellerID};//生成访问器,在.js文件中进行函数调用; } </script>
在页面中有了上述访问器,即可在js校验文件中操作:
**.js:
<script type="text/javascript"> function ValidNull() { var con=document.getElementById(getNetID().Id1).value; ... return false; } </script>
OVER!
More: http://blog.donews.com/me1105/archive/2011/04/23/151.aspx