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 ...
随机推荐
- java并发编程(十九)障碍器CyclicBarrier
转载请注明出处:http://blog.csdn.net/ns_code/article/details/17512983 CyclicBarrier(又叫障碍器)同样是Java 5中加入的新特性,使 ...
- Hbuilder开发HTML5 APP之侧滑菜单
1.思路: 其时有2个WebView,一个main是用来装主页面,一个menu是用来装菜单(为提高性能,菜单项是采用了预加载方式的,预加载时为了避免和主页面争夺资源,采用延时加载,例如: //plus ...
- ex3-数字和数字计算
代码: print("I will now count my chickens:") print("hens", 25+30/6)print("Roo ...
- norm函数的作用,matlab
格式:n=norm(A,p)功能:norm函数可计算几种不同类型的返回A中最大一列和,即max(sum(abs(A))) 2 返回A的最大奇异值,和n=norm(A)用法一样 inf 返回A中最大一行 ...
- 学习笔记: Delphi之线程类TThread
新的公司接手的第一份工作就是一个多线程计算的小系统.也幸亏最近对线程有了一些学习,这次一接手就起到了作用.但是在实际的开发过程中还是发现了许多的问题,比如挂起与终止的概念都没有弄明白,导致浪费许多的时 ...
- 皮裤原理和运营微信公众号dotNET跨平台
经常碰到有同学对.NET跨平台存在各种疑惑和误解,原因是什么呢?当然我是知道.NET的跨平台不是问题,而且微软2014年的努力可圈可点,而且还有很多人对.NET的前景感到困惑.春节期间突然明白了,这就 ...
- java中文乱码解决之道(七)-----JSP页面编码过程
我们知道JSP页面是需要转换为servlet的,在转换过程中肯定是要进行编码的.在JSP转换为servlet过程中下面一段代码起到至关重要的作用. <%@ page language=" ...
- 【Java并发编程实战】-----“J.U.C”:Condition
在看Condition之前,我们先来看下面这个例子: 工厂类,用来存放.取出商品: public class Depot { private int depotSize; //仓库大小 private ...
- C# 6.0 功能预览 (二)
在Language Feature Status上面看到,其实更新的并不是特别多,为了不会误导看了C# 6.0 功能预览 (一)的园友,现在把官方的更新列表拿了过来,供大家参考 Roslyn 编译平台 ...
- 利用Hexo搭建个人博客-环境搭建篇
我是一个爱写博客进行总结分享的人.然而,有着热爱写博客并且深知写博客好处的我,却没有好好的把这个习惯坚持下来.如今毕业已经一年多了吧,每一次与师弟师妹们聊天,我总会意味深长的建议他们,一定要定期梳理总 ...