jquery自定义属性(类型/属性值)


Posted in Javascript onMay 21, 2013
<script src="jquery-1.9.1.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(function () { 
var ping = ''; 
switch ($('#Select3 option:selected').text()) { 
case '图片': ping += '<img'; break; 
case '文本框': ping += '<input type=text'; break; 
case '按钮': ping += '<input type=button'; break; 
} 
$('#attrzhi').blur(function () { 
ping += ' '; 
ping += $('#Select2 option:selected').text(); 
ping += '='; 
ping += $('#attrzhi').val(); 
}) 
$('#Button1').click(function () { 
ping += '/>'; 
alert(ping); 
$('#show').append(ping); 
}) }) 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
<table> 
<tr><td><!--什么东西--> 添加类型:</td><td><select id="Select3"> 
<option>图片</option> 
<option>文本框</option> 
<option>按钮</option> 
</select></td><td rowspan="5" id='show'></td></tr> 
<tr><td> 
<!--需要设置的属性值--> 
属性:</td><td> <select id="Select2"> 
<option>src</option> 
<option>width</option> 
<option>height</option> 
<option>title</option> 
<option>value</option> 
<option>font-size</option> 
<option>color</option> 
</select> 
</td></tr> 
<tr><td>属性值:</td><td><input id="attrzhi" type="text" /></td></tr> 
<tr><td colspan="2"><div id="showattr"></div></td></tr> 
<tr><td> 内容:</td><td><input id="Text1" type="text" /></td></tr> 
<tr><td> 
<input id="Button1" type="button" value="创建" /></td></tr> 
</table> 
</div> 
</form> 
</body>
Javascript 相关文章推荐
SyntaxHighlighter代码加色使用方法
Sep 07 Javascript
javascript Object与Function使用
Jan 11 Javascript
JavaScript中Function详解
Feb 27 Javascript
js文本框走动跑马灯效果代码分享
Aug 25 Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 Javascript
jQuery插件支持同一页面被多次调用
Feb 14 Javascript
Webpack 实现 AngularJS 的延迟加载
Mar 02 Javascript
js获取当前年月日-YYYYmmDD格式的实现代码
Jun 01 Javascript
微信和qq时间格式模板实例详解
Oct 21 Javascript
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
Feb 26 Javascript
快速解决vue-cli在ie9+中无效的问题
Sep 04 Javascript
原生js拖拽功能制作滑动条实例代码
Feb 05 Javascript
jquery实现智能感知连接外网搜索
May 21 #Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
May 21 #Javascript
Extjs407 getValue()和getRawValue()区别介绍
May 21 #Javascript
js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器
May 21 #Javascript
深入理解javaScript中的事件驱动
May 21 #Javascript
基于jquery实现控制经纬度显示地图与卫星
May 20 #Javascript
jquery控制左右箭头滚动图片列表的实例
May 20 #Javascript
You might like
星际争霸秘籍
2020/03/04 星际争霸
PHP中for循环语句的几种变型
2007/03/16 PHP
PHP中函数内引用全局变量的方法
2008/10/20 PHP
深入php define()函数以及defined()函数的用法详解
2013/06/05 PHP
smarty模板引擎从php中获取数据的方法
2015/01/22 PHP
Laravel框架模型的创建及模型对数据操作示例
2019/05/07 PHP
学习YUI.Ext 第二天
2007/03/10 Javascript
JQuery 选择器 xpath 语法应用
2010/05/13 Javascript
Web 前端设计模式--Dom重构 提高显示性能
2010/10/22 Javascript
JS的参数传递示例介绍
2014/02/08 Javascript
javascript + jquery实现定时修改文章标题
2014/03/19 Javascript
javascript中返回顶部按钮的实现
2015/05/05 Javascript
javascript中传统事件与现代事件
2015/06/23 Javascript
AngularJS 与Bootstrap实现表格分页实例代码
2016/10/14 Javascript
JavaScript实现自定义媒体播放器方法介绍
2017/01/03 Javascript
js以及jquery实现手风琴效果
2020/04/17 Javascript
Vue form 表单提交+ajax异步请求+分页效果
2017/04/22 Javascript
详谈表单格式化插件jquery.serializeJSON
2017/06/23 jQuery
React Native 环境搭建的教程
2017/08/19 Javascript
浅谈Express异步进化史
2017/09/09 Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
2017/10/25 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
2018/08/09 jQuery
vue-rx的初步使用教程
2018/09/21 Javascript
[12:51]71泪洒现场!是DOTA2让经典重现
2014/03/24 DOTA
Python中表达式x += y和x = x+y 的区别详解
2017/06/20 Python
使用Python爬取最好大学网大学排名
2018/02/24 Python
Python DataFrame.groupby()聚合函数,分组级运算
2018/09/18 Python
对python 自定义协议的方法详解
2019/02/13 Python
python装饰器使用实例详解
2019/12/14 Python
Luxplus瑞典:香水和美容护理折扣
2018/01/28 全球购物
中介公司区域经理岗位职责范本
2014/03/02 职场文书
篮球社团活动总结
2014/06/27 职场文书
大学生见习期满自我鉴定
2014/09/13 职场文书
员工辞退通知书
2015/04/17 职场文书
导游词之寿县报恩寺
2020/01/19 职场文书
python实现图片批量压缩
2021/04/24 Python