您当前的位置:首页 > 分类 > 技术资讯 > JS > 正文

JS常用小功能

发布时间:2013-05-24 22:52:17      来源:51推一把
【摘要】1.鼠标点击,经过改变input样式 2.文本框输入限定字符自动转跳到下一个
1.鼠标点击,经过改变input样式
<input type="text" name="k" id="k" value="关键字" onfocus="javascript:if(this.value==关键字)this.value=;this.style.color=#666" onblur="javascript:if(this.value==)this.value=关键字;this.style.color=#999"/>
2.文本框输入限定字符自动转跳到下一个
<div id="abs">
<input class="s1" type="text" size="10">
<input class="s1" type="text" size="10">
<input class="s1" type="text" size="10">
<input class="s1" type="text" size="10">
</div>
<script language="javascript">
function Each(arr,fn){for(var i=0,len=arr.length;i<len;i++){fn.call(arr[i],i,arr);};};
(function(inputs){
Each(inputs,function(i){
var _o=this;
this.onkeyup=function(){
if(_o.value.length>=4){
if(inputs[i+1]){
inputs[i+1].focus();
}else{
_o.value=_o.value.slice(0,4);
}
}
}
})
})(document.getElementById(abs).getElementsByTagName(input));
</script>
3.js一维数组存取
var testArr={1:"happy",2:"admin",3:"lis"}
function Arr_name(i)
{
var str=testArr[i];
if(!str){var str="";}
document.write(str);
}
<script>Arr_name(1);</script>
4.JS输出DIV中的内容
alert(document.getElementById("rs").innerHTML);
alert(document.getElementById("rs").innerText);
将DIV中的内容重新赋值
document.getElementById(Fcode).innerHTML=您的邀请码为001;
5.onfocus=“this.blur()” 点击去掉超链接外的虚框
6.获取radio选中值
<script>
//$写法,用于获取元素ID名称
function $(id){return document.getElementById(id);}
//获取 radio 选中值
function GetValue(){
//获取 radio 所在容器名,根据容器名称搜索 radio 的标签 input
var radios = $("radios").getElementsByTagName("input");
//初始化对象
var grade = "";
//是否选中 radio,默认不选中,radio 可指定 checked="checked" 不受 flag 影响
var flag = false;
//根据容器中搜索到的 input 标签的个数(长度)进行遍历
for(var i=0;i<radios.length;i++){
//如果当前有选中
if(radios[i].checked == true){
//赋值
grade = radios[i].value;
//赋值
flag = true;
//结束循环
break;
}
}
//判断 radio 是否有选中
if(!flag){
alert("No choose");
return;
}else{
alert(grade);
}
}
</script>
<div id="radios">
<input name="radio" type="radio" value="1"/>1
<input name="radio" type="radio" value="2" />2
<input name="radio" type="radio" value="3" />3
<input name="radio" type="radio" value="4" />4
<input name="radio" type="radio" value="5" />5
<input name="button" type="button" value="GetValue" onclick="GetValue()"/>
</div>