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 相关文章推荐
jquery ajax abort()的使用方法
Oct 28 Javascript
屏蔽网页右键复制和ctrl+c复制的js代码
Jan 04 Javascript
jQuery实现的鼠标滑过弹出放大图片特效
Jan 08 Javascript
使用jQuery的ajax方法向服务器发出get和post请求的方法
Jan 13 Javascript
Bootstrap一款超好用的前端框架
Sep 25 Javascript
js原生日历的实例(推荐)
Oct 31 Javascript
js字符串处理之绝妙的代码
Apr 05 Javascript
vue中input的v-model清空操作
Sep 06 Javascript
vue-cli3 取消eslint校验代码的解决办法
Jan 16 Javascript
vue中的过滤器及其时间格式化问题
Apr 09 Javascript
vue-router的hooks用法详解
Jun 08 Javascript
vue实现购物车的小练习
Dec 21 Vue.js
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
php页码形式分页函数支持静态化地址及ajax分页
2014/03/28 PHP
PHP多维数组遍历方法(2种实现方法)
2015/12/10 PHP
PHP CodeIgniter分页实例及多条件查询解决方案(推荐)
2017/05/20 PHP
Javascript 验证上传图片大小[客户端]
2009/08/01 Javascript
Js 回车换行处理的办法及replace方法应用
2013/01/24 Javascript
使用js 设置url参数
2013/07/08 Javascript
固定表格行列(expression)在IE下适用
2013/07/25 Javascript
js和css写一个可以自动隐藏的悬浮框
2014/03/05 Javascript
javascript制作照片墙及制作过程中出现的问题
2016/04/04 Javascript
js改变透明度实现轮播图的算法
2020/08/24 Javascript
js 颜色选择插件
2017/01/23 Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
2017/05/02 Javascript
详谈js对url进行编码和解码(三种方式的区别)
2017/08/16 Javascript
Vue项目打包部署到iis服务器的配置方法
2019/10/14 Javascript
vue路由跳转传递参数的方式总结
2020/05/10 Javascript
浅谈Vue开发人员的7个最好的VSCode扩展
2021/01/20 Vue.js
R vs. Python 数据分析中谁与争锋?
2017/10/18 Python
Python cookbook(数据结构与算法)实现优先级队列的方法示例
2018/02/18 Python
对dataframe数据之间求补集的实例详解
2019/01/30 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
linux中如何使用python3获取ip地址
2019/07/15 Python
Flask框架中request、请求钩子、上下文用法分析
2019/07/23 Python
Django将默认的SQLite更换为MySQL的实现
2019/11/18 Python
html5在移动端的屏幕适应问题示例探讨
2014/06/15 HTML / CSS
h5调用摄像头的实现方法
2016/06/01 HTML / CSS
美国美发品牌:Bumble and Bumble
2016/10/08 全球购物
中兴通讯全球官方网站:ZTE
2020/12/26 全球购物
网络工程系信息安全技术专业大学生求职信
2013/10/22 职场文书
公务员职务工作的自我评价
2013/11/01 职场文书
施工安全责任书
2014/04/14 职场文书
十佳护士先进事迹
2014/05/08 职场文书
电钳工人个人求职信
2014/05/10 职场文书
国际贸易专业自荐信
2014/06/10 职场文书
煤矿安全知识竞赛活动总结
2014/07/07 职场文书
工作保证书
2015/01/17 职场文书
看完这篇文章获得一些java if优化技巧
2021/07/15 Java/Android