JS Div滚动,下拉框添加属性,年月日下拉条
创建某一下拉菜单的项:
str = str+"<option value='"+i+"'>"+i+"</option>";
提取从i到j之间的字符串:
kd.substr(i,j)
right的第i个子节点的内容:
right.childNodes.item(i)
实例
Div滚动:
<style type="text/css"> *{ margin:0px auto; padding:0px} #wai{ width:100%; height:500px;} #left{height:500px; background-color:#63C; float:left} #right{ height:500px; background-color:#FC3; float:left} #anniu{ width:50px; height:50px; background-color:#F30; position:absolute; top:225px; z-index:10; } #anniu:hover{ cursor:pointer} </style> </head> <body> <div id="wai"> <div id="left" style="width:200px"></div> <div id="right" style="width:800px"></div> </div> <div id="anniu" style="left:175px" onclick="hua()"></div> <script type="text/javascript"> var id; function hua() { id = window.setInterval("dong()",10); } //滑动的方法,调一次滑动3px function dong() { //改蓝色的宽度 200px var zuo = document.getElementById("left"); kd = zuo.style.width; if(parseInt(kd.substr(0,kd.length-2))>=800) { window.clearInterval(id); return; } kd = parseInt(kd.substr(0,kd.length-2))+3; zuo.style.width = kd+"px"; //改黄色的宽度 var you = document.getElementById("right"); ykd = you.style.width; ykd = parseInt(ykd.substr(0,ykd.length-2))-3; you.style.width = ykd+"px"; //改红色的left var hong = document.getElementById("anniu"); hleft = hong.style.left; hleft = parseInt(hleft.substr(0,hleft.length-2))+3; hong.style.left = hleft+"px"; } </script> </body>
下拉框添加属性:
<style type="text/css"> *{ margin:0px auto; padding:0px} #wai{ width:500px; height:500px} #left{ width:200px; height:500px; float:left} #zhong{ width:100px; height:500px; float:left} #right{ width:200px; height:500px; float:left} </style> </head> <body> <br /> <div id="wai"> <div id="left"> <select style="width:200px; height:300px" id="selleft" multiple="multiple"> <option value="山东">山东</option> <option value="淄博">淄博</option> <option value="张店">张店</option> </select> </div> <div id="zhong"> <div style="margin-left:10px; margin-top:20px"> <input style="width:60px; height:30px" type="button" value=">>" onclick="moveall()" /> </div> <div style="margin-left:10px; margin-top:30px"> <input style="width:60px; height:30px" type="button" value=">" onclick="moveone()" /> </div> </div> <div id="right"> <select id="selright" multiple="multiple" style="width:200px; height:300px"></select> </div> </div> <script type="text/javascript"> function moveone() { var left = document.getElementById("selleft"); var right = document.getElementById("selright"); var xz = left.value; var str = "<option value='"+xz+"'>"+xz+"</option>"; //判断 //alert(right.childNodes.item(0));} var bs = 0; for(var i=0;i<right.childNodes.length;i++) { if(right.childNodes.item(i).text==xz) { bs = 1; } } if(bs==0) { //追加 right.innerHTML = right.innerHTML+str; } } function moveall() { var left = document.getElementById("selleft"); var right = document.getElementById("selright"); right.innerHTML = left.innerHTML; } </script> </body>
年月日下拉条:
<script type="text/javascript"> FillNian(); FillYue(); FillTian(); function FillNian() { var b = new Date(); //获取当前时间 var nian = parseInt(b.getFullYear()); var str = ""; for(var i=nian-5;i<nian+6;i++) { str = str+"<option value='"+i+"'>"+i+"</option>"; } document.getElementById("nian").innerHTML = str; } function FillYue() { var str = ""; for(var i=1;i<13;i++) { str = str+"<option value='"+i+"'>"+i+"</option>"; } document.getElementById("yue").innerHTML = str; } function FillTian() { var yue = document.getElementById("yue").value; var nian = document.getElementById("nian").value; var ts = 31; if(yue==4 || yue==6 || yue==9 || yue==11) { ts=30; } if(yue==2) { if((nian%4==0 && nian%100 != 0) || nian%400==0) { ts = 29; } else { ts = 28; } } var str = ""; for(var i=1;i<ts+1;i++) { str = str+"<option value='"+i+"'>"+i+"</option>"; } document.getElementById("tian").innerHTML = str; } function biantian() { FillTian(); } </script> </body>
JS Div滚动,下拉框添加属性,年月日下拉条的更多相关文章
- JS为Select下拉框添加输入功能
JavaScript使用parentNode.nextSibling.value实现的本功能,实际上你会发现网页上有两个控件元素,一个是Select,一个是input,使用CSS将input覆盖于se ...
- extjs下拉框添加复选框
给ComboBox组件配置listConfig 下拉框代码: var gyslxcm = Ext.create('Ext.form.field.ComboBox',{ id : 'gyslxcm', ...
- jquery学习笔记:获取下拉框的值和下拉框的txt
<div class="form-group"> <select class="form-control" id="iv_level ...
- Android中自定义xml文件给Spinner下拉框赋值并获取下拉选中的值
场景 实现效果如下 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 将布局改 ...
- 给datagridview的下拉框添加valueChange事件
修改datagridview的EditMode属性为EdutOnEnter,否则需要点2次以上才出现下拉框 1.给DataGridView添加EditingControlShowing事件: 2.编辑 ...
- EasyUI combobox下拉框添加水平滚动条和垂直滚动条
在EasyUI中combobox组件设置滚动条: 1.垂直滚动条:设置panelHeight属性,默认200,组件的数据过多滚动条自动出现,设置auto,则不出现滚动条. 2.水平滚动条:水平滚动条在 ...
- WebForm,Winfrom下拉框添加全部行
WebForm: dropPostalLineNo.DataSource = "数据源"; dropPostalLineNo.DataTextField = &quo ...
- 解决select下拉框禁用(设置disabled属性),后台获取值为空
如果下拉框设置disabled属性后,提交表单到后台,后台获取的下拉框的值为空,以下有三种解决获取不到下拉框选项值的方法. 有下拉框html如:<select name="select ...
- js获取select下拉框的value值和text文本值
介绍一种取下拉框值以及绑定下拉框数据的方法 这里用到的jquery-ui-multiselect插件 1.前台html代码 <span class="ModuleFormFiel ...
随机推荐
- ntko office在线编辑控件问题记录
ntko office在线预览插件 http://www.ntko.com/ 问题:火狐或谷歌下保存报[没有打开的文档]错误,ie正常 原因:火狐.谷歌.ie的各方法执行文字不同,ie嵌在页面,而火狐 ...
- hadoop+tachyon+spark的zybo cluster集群综合配置
1.zybo cluster 架构简述: 1.1 zybo cluster 包含5块zybo 开发板组成一个集群,zybo的boot文件为digilent zybo reference design提 ...
- EditPlus快捷键
Editplus 选中一行: ctrl+rEditplus 复制一行: ctrl+r选择行,然后ctrl+c复制.复制一行到下一行中:Editplus有:Ctrl+j 复制上一行的一个字符到当前行Ed ...
- Sublime Text 3 配置和使用方法
下载: Sublime Text 3 官方下载地址 Sublime Text 3 汉化破解版 资料: Sublime Text 非官方文档 技巧 -用户或-User后缀的菜单项,其对应的配置文件都 ...
- Unity 5.3.5p8 C#编译器升级
Unity 5.3.5p8的C#编译器升级 注意:该版本是单独升级C#编译器的测试版!请使用文中提供的下载链接! 基于Unity 5.3.5p8的C#编译器升级!下载链接 试用该版本前请先备份项目,遇 ...
- Expert 诊断优化系列------------------内存不够用么?
现在很多用户被数据库的慢的问题所困扰,又苦于花钱请一个专业的DBA成本太高.软件维护人员对数据库的了解又不是那么深入,所以导致问题迟迟不能解决,或只能暂时解决不能得到根治.开发人员解决数据问题基本又是 ...
- 干掉Unity3D
我为什么想干掉Unity3D? 这个问题容我不答,每个做技术的人总有一些完美主义. 你使用u3d的过程中是不是痛并快乐着呢. 就从两个国内具有相当普遍性的痛点说起. il2cpp,unity作出了这个 ...
- EL
- SpringMVC配置项学习笔记
1. <mvc:annotation-driven /> <mvc:annotation-driven />是一种简写形式,默认会注册DefaultAnnotationHand ...
- removeClass 按钮点击添加class效果
html代码: <div class="game"> <span class="active">全部</span> < ...