jQuery的一些方法理出一些常用的方法:
-
- $('#test option:first').val();
-
- $('#test option:last').val();
-
- $('#test option:eq(1)').val();
-
- $('#test').val();
- $('#test option:selected').val();
-
- $('#test').attr('value','2');
-
- $('#test option:last').attr('selected','selected');
- $("#test").attr('value' , $('#test option:last').val());
- $("#test").attr('value' , $('#test option').eq($('#test option').length - 1).val());
-
- $('#test option').length;
-
- $("#test").append("ff");
- $("ff").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();
-
-
- $('#test optgroup:eq(0)').attr('label');
-
- $('#test optgroup:eq(1) :option:eq(0)').val();
获取select中选择的text与value相关的值
- 获取select选择的Text : var checkText=$("#slc1").find("option:selected").text();
- 获取select选择的value:var checkValue=$("#slc1").val();
- 获取select选择的索引值: var checkIndex=$("#slc1 ").get(0).selectedIndex;
- 获取select最大的索引值: var maxIndex=$("#slc1 option:last").attr("index");
设置select选择的Text和Value
- 设置select索引值为1的项选中:$("#slc1 ").get(0).selectedIndex=1;
- 设置select的value值为4的项选中: $("#slc1 ").val(4);
- 设置select的Text值为JQuery的选中:
- $("#slc1 option[text='jQuery']").attr("selected", true);
- PS:特别要注意一下第三项的使用哦。看看JQuery的选择器功能是如此地强大呀!
友情提示:
jQuery代码中,可以直接在select对应的dom节点上直接复制就可以实现选中的效果,
如:$("#productId").val(data.id);
但是在实际开发中我们经常遇到一个问题就是ajax返回数据渲染失败,
这是由于ajax自身书异步请求的,你不知道是返回结果值先渲染页面还是你的jquer先操作dom节点,解决这个问题很简单,将ajax请求设为同步,加上asyn: false即可;
添加删除option项
- 为select追加一个Option(下拉项)
- $("#slc2").append(""+i+"");
- 为select插入一个option(第一个位置)
- $("#slc2").prepend("请选择");
- PS: prepend 这是向所有匹配元素内<span id="transmark"></span>部的开始处插入内容的最佳方式。
- 删除select中索引值最大option(最后一个)
- $("#slc2 option:last").remove();
- 删除select中索引值为0的option(第一个)
- $("#slc2 option[index='0']").remove();
- 删除select中value='3'的option
- $("#slc2 option[value='3']").remove();
- 删除select中text='4'的option
- $("#slc2 option[text='3']").remove();
option去重
- $("select option").each(function() {
- text = $(this).text();
- if($("select option:contains("+text+")").length > 1)
- $("select option:contains("+text+"):gt(0)").remove();
- });
判断checkbox是否选择:
(如果选择的checkbox本身的话,可以直接用this.checked判断是否被选择,如果从其他节点获取到checkbox节点的话用方法二)
- <span style="font-size:12px;">网上大多数文章都提供的方法都是无效的,害死个人,本文中的方法小编亲测试有效,建议使用方法二:
-
- 方法一:
- if ($("#checkbox-id")get(0).checked) {
-
- }
-
- 方法二:
- if($('#checkbox-id').is(':checked')) {
-
- }
-
- 方法三:
- if ($('#checkbox-id').attr('checked')) {
-
- }</span>
获取选中checkbox的个数:
- <span style="font-size:12px;">var num = $("input[type='checkbox'][class='subcheck']:checked").length;</span>