jQuery生成asp.net服务器控件的代码


Posted in Javascript onFebruary 04, 2010

HTML如下

<tr> 
<td class="leftTd" style="width: 107px">附加金额</td> 
<td style="width: 315px"><asp:TextBox ID="txtExtendMoney" Text="0" runat="server"></asp:TextBox> 
<asp:RegularExpressionValidator ID="regExtend" runat="server" ControlToValidate="txtExtendMoney" Display="Dynamic" ErrorMessage="格式不正确" ValidationExpression="[1-9]\d*\.\d*|0\.\d*[1-9]\d*|^[1-9]\d*|0"></asp:RegularExpressionValidator> 
<asp:RequiredFieldValidator ID="reqExtedNo" runat="server" ControlToValidate="txtExtendMoney" Display="Dynamic" ErrorMessage="不可为空"></asp:RequiredFieldValidator></td> 
<td class="leftTd">结算方式</td> 
<td><asp:DropDownList ID="ddlPayType" runat="server"><asp:ListItem>现金</asp:ListItem><asp:ListItem>银行转账</asp:ListItem></asp:DropDownList></td> 
</tr> 
<tr> 
<td class="leftTd">结算账户</td> 
<td colspan="3"><asp:RadioButtonList ID="rdbPayAccountBank" runat="server" RepeatLayout="Flow"></asp:RadioButtonList></td> 
</tr>

最后一个RadioButtonList的ListItem为“其他账户",当选中时,其后增加相应的asp.net服务器控件。选择其它时移除该控件。

jQuery生成asp.net服务器控件的代码

增加

jQuery生成asp.net服务器控件的代码

引入jQuery,然后如下代码

/*结算方式*/ 
$(":radio:last").bind("click",function(){ 
if($("#txtBankNew").length==0){ 
$(this).parent().append('<span id="span"><label style="margin-left:6px;margin-right:4px;" for="txtBankNew">开户银行</label><input runat='server' id='txtBankNew' type='text' /><label style="margin-left:6px;margin-right:4px;" for="txtAccountNew">开户账户</label><input type='text' id='txtAccountNew' runat='server' /></span>'); 
}; 
$("#txtBankNew").focus().select(); 
}); 
$(":radio:not(:last)").bind("click",function(){ 
if($("#txtBankNew").length>0){ 
$("#span").remove(); 
} 
});

这里值得注意的是如果append之后的控件为服务器控件,也就是有runat="server"属性的,原先的单引号生成源后会自动变成双引号,并且runat="server"消失。这实际上跟手工在前台书写此DOM结构.net framework处理一致。因此打开此页面源文件可以看到如下
jQuery生成asp.net服务器控件的代码
但不幸的是,该服务器控件依然没有起作用……

还是用隐藏服务器控件来解决吧?!

Javascript 相关文章推荐
替代window.event.srcElement效果的可兼容性的函数
Dec 18 Javascript
JavaScript 操作table,可以新增行和列并且隔一行换背景色代码分享
Jul 05 Javascript
随鼠标移动的时钟非常漂亮遗憾的是只支持IE
Aug 12 Javascript
使用node.js 制作网站前台后台
Nov 13 Javascript
js实现的xml对象转json功能示例
Dec 24 Javascript
Easyui笔记2:实现datagrid多行删除的示例代码
Jan 14 Javascript
React Native AsyncStorage本地存储工具类
Oct 24 Javascript
原生js通过一行代码实现简易轮播图
Jun 05 Javascript
webpack常用配置总览(小结)
Nov 18 Javascript
详解ES6 CLASS在微信小程序中的应用实例
Apr 24 Javascript
使用vue构建多页面应用的示例
Oct 22 Javascript
vue+springboot实现登录验证码
May 27 Vue.js
javascript两段代码,两个小技巧
Feb 04 #Javascript
JavaScript面向对象之静态与非静态类
Feb 03 #Javascript
JavaScript 学习笔记(十六) js事件
Feb 01 #Javascript
js左侧多级菜单动态的解决方案
Feb 01 #Javascript
javascript 三种编解码方式
Feb 01 #Javascript
对字符串进行HTML编码和解码的JavaScript函数
Feb 01 #Javascript
javaScript 关闭浏览器 (不弹出提示框)
Jan 31 #Javascript
You might like
令PHP初学者头疼十四条问题大总结
2008/11/12 PHP
PHP中usort在值相同时改变原始位置问题的解决方法
2011/11/27 PHP
PHP写的求多项式导数的函数代码
2012/07/04 PHP
php笔记之:有规律大文件的读取与写入的分析
2013/04/26 PHP
ThinkPHP实现动态包含文件的方法
2014/11/29 PHP
javascript div 遮罩层封锁整个页面
2009/07/10 Javascript
元素的内联事件处理函数的特殊作用域在各浏览器中存在差异
2011/01/12 Javascript
js文件缓存之版本管理详解
2013/07/05 Javascript
js改变img标签的src属性在IE下没反应的解决方法
2013/07/23 Javascript
jQuery中prop()方法用法实例
2015/01/05 Javascript
jQuery添加删除DOM元素方法详解
2016/01/18 Javascript
Dojo获取下拉框的文本和值实例代码
2016/05/27 Javascript
原生JS简单实现ajax的方法示例
2016/11/29 Javascript
jQuery EasyUI 页面加载等待及页面等待层
2017/02/06 Javascript
AngularJs实现聊天列表实时刷新功能
2017/06/15 Javascript
从对象列表中获取一个对象的方法,依据关键字和值
2017/09/20 Javascript
Angular模版驱动表单的使用总结
2018/05/05 Javascript
浅谈PDF.js使用心得
2018/06/07 Javascript
使用Vue.set()方法实现响应式修改数组数据步骤
2019/11/09 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
Python实现二分法算法实例
2015/02/02 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
Python实现将json文件中向量写入Excel的方法
2018/03/26 Python
基于Python fminunc 的替代方法
2020/02/29 Python
Python Dataframe常见索引方式详解
2020/05/27 Python
详解CSS3新增的背景属性
2019/12/25 HTML / CSS
HTML5 Canvas绘制圆点虚线实例
2015/01/01 HTML / CSS
static全局变量与普通的全局变量有什么区别?static局部变量和普通局部变量有什么区别?static函数与普通函数有什么区别?
2015/02/22 面试题
编程实现去掉XML的重复结点
2014/05/28 面试题
模具设计与制造专业应届生求职信
2013/10/18 职场文书
家长给孩子的评语
2014/01/30 职场文书
简历里的自我评价范文
2014/02/24 职场文书
2014年党员自我评议对照检查材料
2014/09/20 职场文书
利用Nginx代理如何解决前端跨域问题详析
2021/04/02 Servers
苹果M1芯片安装nginx 并且部署vue项目步骤详解
2021/11/20 Servers
python中对列表的删除和添加方法详解
2022/02/24 Python