JQuery选中select组件被选中的值方法


Posted in jQuery onMarch 08, 2018

jquery获取select选择的文本与值

获取select :

获取select 选中的 text :

$(“#ddlregtype”).find(“option:selected”).text();

获取select选中的 value:

$(“#ddlregtype “).val();

获取select选中的索引:

$(“#ddlregtype “).get(0).selectedindex;

设置select:

设置select 选中的索引:

$(“#ddlregtype “).get(0).selectedindex=index;//index为索引值

设置select 选中的value:

(“#ddlregtype “).attr(“value”,”normal“);(“#ddlregtype “).attr(“value”,”normal“);(“#ddlregtype “).val(“normal”); 
$(“#ddlregtype “).get(0).value = value;

设置select 选中的text:

var count=$("#ddlregtype option").length;
 for(var i=0;i<count;i++)
   {      if($("#ddlregtype ").get(0).options[i].text == text)
    {
      $("#ddlregtype ").get(0).options[i].selected = true;
      break;
    }
  }
$("#select_id option[text='jquery']").attr("selected", true);

设置select option项:

$("#select_id").append("<option value='value'>text</option>"); //添加一项option
$("#select_id").prepend("<option value='0'>请选择</option>"); //在前面插入一项option
$("#select_id option:last").remove(); //删除索引值最大的option
$("#select_id option[index='0']").remove();//删除索引值为0的option
$("#select_id option[value='3']").remove(); //删除值为3的option
$("#select_id option[text='4']").remove(); //删除text值为4的option

清空 select:

$("#ddlregtype ").empty();

工作需要,要获得两个表单中的值。如图:

如何获得从左边选择框添加到右边选择框中的值?我想了想用网页特效可以获得,这里用了比较流行的jquery。

js代码如下:

//获取所有属性值 var item = $("#select1").val();
$(function(){
 $('#select1').each( //获得select1的所有值
   function(){
    $('button').click(function(){
      alert($('#select2').val()); //获得select2中的select1值
    });
   });
})
</script>

值得注意的是,不能直接写成

$(function(){
 $('#select2').each( //获得select1的所有值,因为前面讲选项从左边添加到右边,jquery其实并没有真正将值从左边传到右边。
   function(){
    $('button').click(function(){
      alert($(this).val()); //获得select2中的select1值
    });
   });
})

html:

选项1
选项2
选项3
选项4
选项5
选项6
选项7

选中添加到右边>>
全部添加到右边>>

<<选中删除到左边
<<全部删除到左边

使用JQuery,Ajax调用动态填充Select的option选项

//绑定ClassLevel1单击事件
  $("#ClassLevel1").change(function () {
    var id = $("#ClassLevel1").val();
    var level2 = $("#ClassLevel2");
    level2.empty();
    $("#ClassLevel3").hide();
    $.ajax({
      url: "./askCommon.ashx?action=getclasslevel&pid=" + id,
      data: { "type": "ajax" },
      datatype: "json",
      type: "get",
      success: function (data) {
        var json = eval_r(data);
        for (var ind in json) {
          level2.append($("<option value='" + json[ind].id + "'>" + json[ind].typename + "</option>"));
        }

      }
    });
  })

以上这篇JQuery选中select组件被选中的值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery实现div跟随鼠标移动
Aug 20 jQuery
jquery实现简单实用的轮播器
May 23 jQuery
jQuery实现键盘回车搜索功能
Jul 25 jQuery
Jquery中.bind()、.live()、.delegate()和.on()之间的区别详解
Aug 01 jQuery
jQuery实现全选、反选和不选功能
Aug 16 jQuery
jquery动态赋值id与动态取id方法示例
Aug 21 jQuery
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 jQuery
jQuery实现的淡入淡出与滑入滑出效果示例
Apr 18 jQuery
JS与jQuery判断文本框还剩多少字符可以输入的方法
Sep 01 jQuery
jQuery简单实现根据日期计算星期几的方法
Jan 09 jQuery
JQuery判断radio单选框是否选中并获取值的方法
Jan 17 jQuery
基于JQuery实现页面定时弹出广告
May 08 jQuery
jQuery+koa2实现简单的Ajax请求的示例
Mar 06 #jQuery
轻松搞定jQuery+JSONP跨域请求的解决方案
Mar 06 #jQuery
jQuery实现左右滑动的toggle方法
Mar 03 #jQuery
jquery radio 动态控制选中失效问题的解决方法
Feb 28 #jQuery
详解jQuery中的isPlainObject()使用方法
Feb 27 #jQuery
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 #jQuery
jQuery实现碰到边缘反弹的动画效果
Feb 24 #jQuery
You might like
PHP 中的批处理的实现
2007/06/14 PHP
php mysql Errcode: 28 终极解决方法
2009/07/01 PHP
将文件夹压缩成zip文件的php代码
2009/12/14 PHP
使用PHP实现Mysql读写分离
2013/06/28 PHP
zend framework框架中url大小写问题解决方法
2014/08/19 PHP
PHP的Yii框架中Model模型的学习教程
2016/03/29 PHP
PHP中快速生成随机密码的几种方式
2017/04/17 PHP
PHP执行linux命令6个函数代码实例
2020/11/24 PHP
Nigma vs Alliance BO5 第二场2.14
2021/03/10 DOTA
Extjs中通过Tree加载右侧TabPanel具体实现
2013/05/05 Javascript
iframe窗口高度自适应的实现方法
2014/01/08 Javascript
jQuery使用slideUp方法实现控制元素缓慢收起
2015/03/27 Javascript
swtich/if...else的替代语句
2015/08/16 Javascript
原生js和jquery分别实现横向导航菜单效果
2016/05/13 Javascript
javascript数据类型详解
2017/02/07 Javascript
基于js 字符串indexof与search方法的区别(详解)
2017/12/04 Javascript
select标签设置默认选中的选项方法
2018/03/02 Javascript
浅谈小程序 setData学问多
2019/02/20 Javascript
ajax jquery实现页面某一个div的刷新效果
2021/03/04 jQuery
[05:00]第二届DOTA2亚洲邀请赛主赛事第三天比赛集锦.mp4
2017/04/04 DOTA
[03:55]DOTA2完美大师赛选手传记——LFY.MONET
2017/11/18 DOTA
[05:23]DOTA2-DPC中国联赛2月1日Recap集锦
2021/03/11 DOTA
Python实现保证只能运行一个脚本实例
2015/06/24 Python
windows及linux环境下永久修改pip镜像源的方法
2016/11/28 Python
Python爬虫实例扒取2345天气预报
2018/03/04 Python
利用python和ffmpeg 批量将其他图片转换为.yuv格式的方法
2019/01/08 Python
TensorFlow dataset.shuffle、batch、repeat的使用详解
2020/01/21 Python
为什么相对PHP黑python的更少
2020/06/21 Python
Django视图类型总结
2021/02/17 Python
皮尔·卡丹巴西官方商店:Pierre Cardin
2017/07/21 全球购物
周仰杰(JIMMY CHOO)英国官方网站:闻名世界的鞋子品牌
2018/10/28 全球购物
2014年青年志愿者工作总结
2014/12/09 职场文书
冰峪沟导游词
2015/02/09 职场文书
MySQL 存储过程的优缺点分析
2021/05/20 MySQL
vue实现登陆页面开发实践
2022/05/30 Vue.js
HTML页面点击按钮关闭页面的多种方式
2022/12/24 HTML / CSS