jquery简洁篇

来源:互联网 发布:免费虚拟主机空间php 编辑:程序博客网 时间:2024/06/06 08:41

几个基本的页面元素:

radio

<input type="radio" value="1" name="testradio">1文本
<input type="radio" value="2" name="testradio">2文本
<input type="radio" value="3" name="testradio">3文本
<input type="radio" value="4" >4文本


如果name相同,则他们是互斥的,只能选其中之一

如果name不同,则可以同时选

如下图:文本1 文本2 文本3就是互斥的,只能选其中之一



jquery对radio的操作[规律是:只要匹配值就用中括号括起来]


 1.获取选中值

用name

$("input[name='testradio']:checked").val();//因为是单选的,所以可以获取他的值

用type: 

$("input[type='radio']:checked").val();

$("input:radio[name='testradio']:checked").val();


 2.选中某个radio ----------checked

$("input[type=radio][value=0]").attr("checked",'checked');

$("input:radio[value=0]").attr("checked","checked");

或者选中第几个(如下):

$("input[type='radio'][name='testradio']":eq(1)).attr("checked","checked");


 3.禁用radio-----------------disabled

radio checkbox 设置为不可用都是直接attr 设置disabled

$("#submitsection input:radio[name='testradio']").attr("disabled","disabled");


jquery对checkbox的操作


<label> 

<input type="checkbox" name="godoctor_status1" value="1"

<c:if test="${consultOrderConclusion.godoctorStatus==1}"> checked="checked"</c:if> 

 >是否建议就医

</label>


<label> 

<input type="checkbox" name="overusersendmsg1" value="1" 

<c:if test="${consultOrderConclusion.overusersendmsg==1}"> checked="checked"</c:if>

>用户未发言

</label>

<label> 

<input type="checkbox" name="overuserleave1"   value="1" 

<c:if test="${consultOrderConclusion.overuserleave==1}"> checked="checked"</c:if>

>用户中途离开

</label>

//是否被选中

var godoctor_status1 = $("input[name='godoctor_status1']").is(":checked");



jquery 对Select Option操作
其实所谓jquery操作,说的确切点是对option的控制

<select id="test" name="">
<option value="1">下拉1</option>
<option value="2" selected="selected">下拉2</option>
<option value="3">下拉3</option>
<option value="4">下拉4</option>
</select>


//获取第一个option的值
$("#test     option:first").val(); <=>   $("#test     option:eq(0)").val();

//最后一个option的值
$("#test    option:last").val();


//获取选中的值
$('#test').val();
$("#test    option:selected").val();


//设置值为2的option为选中状态
$("#test :option[value=2]").attr("selected","selected");


$('#test').attr('value','2');//设置最后一个option为选中$('#test option:last').attr('selected','selected');$("#test").attr('value' , $('#test option:last').val());$("#test").attr('value' , $('#test option').eq($('#test option').length - 1).val());//获取select的长度$('#test option').length;//添加一个option$("#test").append("<option value='n+1'>第N+1项</option>");$("<option value='n+1'>第N+1项</option>").appendTo("#test");//添除选中项$('#test option:selected').remove();//删除项选中(这里删除第一项)$('#test option:first').remove();、//指定值被删除$('#test option').each(function(){    if( $(this).val() == '5'){         $(this).remove();     }});$('#test option[value=5]').remove();//获取第一个Group的标签$('#test optgroup:eq(0)').attr('label');//获取第二group下面第一个option的值$('#test optgroup:eq(1) : option:eq(0)').val();



jquery去除点击事件:[把onclick事件赋值为null]

$("#tb_num_39").attr("onclick","null");

$("#tb_num_3g").attr("onclick", "null");

0 0