钱柜999:jQuery对下拉框,实例讲解

钱柜999:jQuery对下拉框,实例讲解

以上是简写,重要的是看代码:

稍加解释一下:

多选框checkbox: $(“#chk1”).attr(“checked”,”);//不打勾
$(“#chk2”).attr(“checked”,true);//打勾
if($(“#chk1”).attr(‘checked’)==undefined) //决断是还是不是业已打勾

chekbox的入选方法:$(“[value=check1”]:checkbox).attr(“checked”,true);

//获得下拉菜单的选中项的公文(注意中间有空格)
var cc1 = $(“.formc select[@name=’country’]
option[@selected]”).text();
//得到下拉菜单的选中项的值
var cc2 = $(‘.formc select[@name=”country”]’).val();
//获得下拉菜单的选中项的ID属性值
var cc3 = $(‘.formc select[@name=”country”]’).attr(“id”);
//清空下拉框//
$(“#select”).empty();$(“#select”).html(”);
//增添下拉框的option
$(“<option value=’1′>1111</option>”).appendTo(“#select”)

获取值: 文本框,文本区域:$(“#txt”).attr(“value”);

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3-10-4</title>
<style type="text/css">
.test{
 font-weight:bold;
 color : red;
}
.add{
 font-style:italic;
}
</style>
 <!--  引入jQuery -->
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script type="text/javascript">
 //<![CDATA[
 $(function(){
   //设置单选下拉框选中
   $("input:eq(0)").click(function(){
      $("#single option").removeAttr("selected"); //移除属性selected
      $("#single option:eq(1)").attr("selected",true); //设置属性selected
   });
   //设置多选下拉框选中
   $("input:eq(1)").click(function(){
      $("#multiple option").removeAttr("selected"); //移除属性selected
      $("#multiple option:eq(2)").attr("selected",true);//设置属性selected
      $("#multiple option:eq(3)").attr("selected",true);//设置属性selected
   });
   //设置单选框和多选框选中
   $("input:eq(2)").click(function(){
      $(":checkbox").removeAttr("checked"); //移除属性checked
      $(":radio").removeAttr("checked"); //移除属性checked
      $("[value=check2]:checkbox").attr("checked",true);//设置属性checked
      $("[value=check3]:checkbox").attr("checked",true);//设置属性checked
      $("[value=radio2]:radio").attr("checked",true);//设置属性checked
   });
 });
 //]]>
 </script>
</head>
<body>
  <input type="button" value="设置单选下拉框选中"/>
  <input type="button" value="设置多选下拉框选中"/>
  <input type="button" value="设置单选框和多选框选中"/>

<br/><br/>

<select id="single">
 <option>选择1号</option>
 <option>选择2号</option>
 <option>选择3号</option>
</select>

<select id="multiple" multiple="multiple" style="height:120px;">
 <option selected="selected">选择1号</option>
 <option>选择2号</option>
 <option>选择3号</option>
 <option>选择4号</option>
 <option selected="selected">选择5号</option>
</select>

<br/><br/>


<input type="checkbox" value="check1"/> 多选1
<input type="checkbox" value="check2"/> 多选2
<input type="checkbox" value="check3"/> 多选3
<input type="checkbox" value="check4"/> 多选4

<br/>

<input type="radio" value="radio1" name="a"/> 单选1
<input type="radio" value="radio2" name="a"/> 单选2
<input type="radio" value="radio3" name="a"/> 单选3
</body>
</html>

//获得复选框的当选的首先项的值
$(“input[@type=checkbox][@checked]”).val();
//由于复选框一般相中的是八个,所以能够循环输出
$(“input[@type=checkbox][@checked]”).each(function(){
alert($(this).val());
});
//不打勾
$(“#chk1”).attr(“checked”,”);
//打勾
$(“#chk2”).attr(“checked”,true);
//推断是或不是已经打勾
if($(“#chk1”).attr(‘checked’)==undefined){}

2,单选框:
$(“input[@type=radio][@checked]”).val();  
//获得单选框的选中项的值(注意中间未有空格)
$(“input[@type=radio][钱柜999:jQuery对下拉框,实例讲解。@value=2]”).attr(“checked”,’checked’);
//设置单选框value=2的为选中状态.(注意中间未有空格)

select下拉列表的入选方法是:$(“slect
option:eq(1)”).attr(“selected”,true);//选中第贰个option

select[@name=’country’] option[@selected]

下拉框select: $(‘#sel’).val();

您可能感兴趣的稿子:

  • Chosen
    基于jquery的选项框插件使用情势
  • jQuery完成选中弹出窗口选取框内容后赋值给文本框的措施
  • 依靠JQuery的Select选取框的美不胜收变身
  • 根据jquery达成select选用框内容左右运动加多删减代码分享
  • 听大人讲jQuery下拉摘取框插件援助单选多选成效代码
  • jquery通过select列表选拔框对表格数据开始展览过滤示例
  • jquery达成select选拔框内容左右活动代码分享
  • Jquery多选下拉列表插件jquery
    multiselect效用介绍及运用
  • 用jquery达成下拉菜单效果的代码
  • 用jquery完成的三个最好轻巧的下拉菜单
  • jQuery模拟12306城市政委员会公投择框作用轻巧达成情势言传身教

代表具有name 属性,並且该属性值为’country’
的select成分里面包车型地铁富有selected 属性的option
成分。能够看看有@起初的就代表前边跟的是性质。

3,复选框:
$(“input[@type=checkbox][@checked]”).val();
//得到复选框的入选的率先项的值
$(“input[@type=checkbox][@checked]”).each(function(){
//由于复选框一般相中的是多少个,所以能够循环输出
   alert($(this).val());
   });

上述那篇各类选择框jQuery的入选方法(实例批注)就是我共享给我们的全体内容了,希望能给大家二个参照他事他说加以考察,也期望咱们多多帮忙脚本之家。

//得到单选框的选中项的值(注意中间未有空格)
$(“input[@type=radio][@checked]”).val();
//设置单选框value=2的为选中状态.(注意中间未有空格)
$(“input[@type=radio][@value=2]”).attr(“checked”,’checked’);

获取值: 文本框,文本区域:$(“#txt”).attr(“value”);
多选框checkbox:$(“#checkbox_id”).attr(“value”);
单选组radio: $(“input[@type=radio][@checked]”).val();
下拉框select: $(‘#sel’).val();

radio的入选方法:$(“[value=radio2”]:radio).attr(“checked”,true);

你只怕感兴趣的稿子:

  • js和jquery分别证实单选框、复选框、下拉框
  • JQuery决断radio(单选框)是或不是选酣春获取选中值方法总计
  • jquery单选框radio绑定click事件达成情势
  • jquery对单选框,多选框,文本框等周围操作小结
  • jquery操作下拉列表、文本框、复选框、单选框集结(收藏)
  • Jquery为单选框checkbox绑定单击click事件
  • jquery
    操作单选框,复选框,下拉列表完成代码
  • jQuery遍历Form示例代码
  • jQuery插件form-validation-engine正则表明式操作示例
  • jquery表单插件form使用形式详解
  • jQuery表单插件ajaxForm实例详解
  • jQuery Form表单取值的措施
  • jQuery轻易达成遍历单选框的不二秘技

var cc1   = $(“.formc select[@name=’country’]
option[@selected]”).text();
//得到下拉菜单的选中项的文件(注意中间有空格)
var cc2 = $(‘.formc select[@name=”country”]’).val();  
//获得下拉菜单的选中项的值
var cc3 = $(‘.formc select[@name=”country”]’).attr(“id”);
//得到下拉菜单的选中项的ID属性值
$(“#select”).empty();//清空下拉框//$(“#select”).html(”);
$(“<option
value=’1′>1111</option>”).appendTo(“#select”)//增添下拉框的option

下拉框:

$(“#chk1”).attr(“checked”,”);//不打勾
$(“#chk2”).attr(“checked”,true);//打勾
if($(“#chk1”).attr(‘checked’)==undefined){} //判定是不是早就打勾

单选框:

单选组radio:
$(“input[@type=radio]”).attr(“checked”,’2′);//设置value=2的项目为当下相中项

admin

网站地图xml地图