Jquery 操作

最新推荐文章于 2021-03-04 16:09:17 发布
最新推荐文章于 2021-03-04 16:09:17 发布 · 335 阅读
文章标签：
#jQuery #CSS #ViewUI
Html js 专栏收录该内容
8 篇文章
订阅专栏

<script>
$(document).ready(function(){
//
   <!-- radio的禁用 -->

    var input = $("#appDIV").find("input:radio");
   input.attr("disabled","disabled");
   input.each(function(){
     if($(this).val()==2){
        $(this).attr("checked",true);
     }    
   });

   <!-- checkbox的禁用 -->
   var checkbox = $("#ce").find("input:checkbox");
   checkbox.attr("disabled","disabled");
    checkbox.each(function(){
     if($(this).val()=="Monthly"){
        $(this).attr("checked",true);
     }    
   });

  <!--select添某个元素为disabled-->
  $('#selectItem option[value=7]').attr('disabled', 'disabled'); 
  $('#selectItem option[value=8]').attr('disabled', 'disabled'); 
  //value就是类别的ID，使用option disabled 属性，但是IE6 好像不支持    
  //找了下一段代码，支持E6   
  $('#selectItem').each(function(){   
    this.rejectDisabled = function(){   
      if (this.options[this.selectedIndex].disabled){   
        if (this.lastSelectedIndex) {   
          this.selectedIndex = this.lastSelectedIndex;   
        } else {   
          var first_enabled = $(this).children('option:not(:disabled)').get(0);   
          this.selectedIndex = first_enabled ? first_enabled.index : 0;   
        }   
      } else {   
        this.lastSelectedIndex = this.selectedIndex;   
      }   
    };   
    this.rejectDisabled();   
    this.lastSelectedIndex = this.selectedIndex;
    $(this).children('option[disabled]').each(function(){   
      $(this).css('color', '#CCC');   
    });   
    $(this).change(function() {   
      this.rejectDisabled();   
    });   
  });
//获取值
//alert( $('#dd').val());//type=text
//alert($('input[name=rr][checked]').val());//type=radio
//alert($('input[name=ff][checked]').val());//type=checkbox
// alert($("select[name=ss] option[selected]").val());//select 相等于alert($("#ss option[selected]").val());

//获取文本
//alert($("select[name=ss] option[selected]"));//select


//控制
/*// Disable #dd 禁用
$("#dd").attr("disabled","disabled");
// Enable #dd 解禁
$("#jj").removeAttr("disabled");*/


//$('input[name=rr]').get(0).checked = true;//第一个radio被选中

//alert($('input[name=rr2]').get(0).checked);
//alert($("input[type=radio][value=34]").attr("checked",'checked'));//value=34的radio被选中

//alert($("input[type=checkbox][value=gd]").attr("checked",'checked'));//value=gd的checkbox被选中
//$('input[name=ff]').get(1).checked = true;//第一个check被选中



/*//根据option的text选中option
count=$("#ss").find("option").length;
for(var i=0;i<count;i++) 
{           
if($("#ss").get(0).options[i].text == 'd') 
{ 
    $("#ss").get(0).options[i].selected = true; 

     break; 
} 
} */

//$("<option value='1'>1111</option><option value='25'>22s22</option>").appendTo("#ss");//增加option
//$("#ss option[value=8]").remove("");//除去 <option value='8'>d</option>

//$("#ss").attr("value",'2');//选中option                            
$('#ss')[0].selectedIndex = 1;//选中option

//$("#ss").empty();//清空全部option

/*//替换文本
var $thirdLink = $("#ssd");
var linkText = $thirdLink.text().replace('foo','bar');
$thirdLink.text(linkText); */


});
</script>

<body>
<div id="appDIV">
    <input type="radio" value="1"/>1
    <input type="radio" value="2"/>2
    <input type="radio" value="3"/>3
</div>
<div id="sel">
   <select id="selectItem">
    <option value="1" disabled="disabled">Flowers</option>
    <option value="2" disabled="disabled">Gardens</option>
    <option value="3" selected ="true">Trees</option>
	<option value="4" disabled="disabled">1</option>
	<option value="5" disabled="disabled">2</option>
	<option value="6" disabled="disabled">3</option>
	<option value="7" >4</option>
	<option value="8" >5</option>
	<option value="9" disabled="disabled">6</option>
   </select> 
</div>
<div id="ce">
    <input type="checkbox" name="newsletter" value="Daily" />Dairy
    <input type="checkbox" name="newsletter" value="Weekly" />Weekly
    <input type="checkbox" name="newsletter" value="Monthly" />Monthly
</div>
<input type="text" id="dd" name="dd" value="dds"/>dd

<input name="rr" id="rr" type="radio" value="34" />ff
<input name="rr" id="rr2" type="radio" value="4" />55

<input name="ff" type="checkbox" value="aa" />jgdg
<input name="ff" type="checkbox" value="gd" />jgdg

<select name="ss" id="ss" size="1">
<option value=""></option>
<option value="8">d</option>
<option value="2">g</option>
</select>

<br/>
<input type="button" id="button" value="11111" />
<input type="button" id="jj" value="2222222" />
<br/>

<div id="ssd">fgfooHello</div>