好记性不如烂笔头,记录一些常用的操作,方便随时查看:
一、JS操作Button
Button有两种类型 :
<input type="button" id="btn01" value="按钮1"/>
<Button id="btn02">按钮2</Button>
1.JS修改按钮文字方法
document.getElementById("btn01").value="新按钮1";
document.getElementById("btn02").innerHtml="新按钮2";
2.JS控制按钮显示与否
document.getElementById("btn01").style.display = "block";//显示
document.getElementById("btn01").style.display = "none";//隐藏
3.JS控制按钮可用与否
document.getElementById("btn01").disabled=true;//不可用
document.getElementById("btn01").disabled=false;//可用
二、JS操作Select
1、动态添加选项option
var obj=document.getElementById('mySelect'); //根据id查找对象,
//添加一个选项
obj.add(new Option("文本","值")); //这个只能在IE中有效
obj.options.add(new Option("text","value")); //这个兼容IE与firefox
2、删除所有选项option
var obj=document.getElementById('mySelect');
obj.options.length=0;
3、删除一个选项option
var obj=document.getElementById('mySelect');
//index,要删除选项的序号,这里取当前选中选项的序号
var index=obj.selectedIndex;
obj.options.remove(index);
4、获得选项option的值
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].value;
5、获得选项option的文本
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].text;
6、修改选项option
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index]=new Option("新文本","新值");
7、删除select
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
三、JS操作Radio
例子:
<input name="test" type="radio" value="0" checked="checked" />
<input name="test" type="radio" value="1" />
<input name="test" type="radio" value="2" />
1.获取选中值,三种方法都可以:
$('input:radio:checked').val();
$("input[type='radio']:checked").val();
$("input[name='test']:checked").val();
2.设置第一个Radio为选中值:
$('input:radio:first').attr('checked', 'checked'); 或者 $('input:radio:first').attr('checked', 'true');
注:attr("checked",'checked')= attr("checked", 'true')= attr("checked", true);
3.设置最后一个Radio为选中值:
$('input:radio:last').attr('checked', 'checked'); 或者 $('input:radio:last').attr('checked', 'true');
4.根据索引值设置任意一个radio为选中值:
$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2.... 或者 $('input:radio').slice(1,2).attr('checked', 'true');
5.根据Value值设置Radio为选中值
$("input:radio[value='rd2']").attr('checked','true'); 或者 $("input[value='rd2']").attr('checked','true');
6.删除Value值为rd2的Radio
$("input:radio[value='rd2']").remove();
7.删除第几个Radio
$("input:radio").eq(索引值).remove();索引值=0,1,2.... 如删除第3个Radio:$("input:radio").eq(2).remove();
8.遍历Radio
function Foo()
{
var selectedIndex = -1;
var form1 = document.getElementsByName("test");
var i = 0;
for (i=0; i<form1.r.length; i++)
{
if (form1.r[i].checked)
{
selectedIndex = i;
alert("您选择项的 value 是:" + form1.r[i].value);
break;
}
}
if (selectedIndex < 0)
{
alert("您没有选择任何项");
}
}