下拉列表select动态添加option和获取选中的option的值和value 您所在的位置:网站首页 设置下拉框的值 下拉列表select动态添加option和获取选中的option的值和value

下拉列表select动态添加option和获取选中的option的值和value

2024-04-05 02:59| 来源: 网络整理| 查看: 265

分别用两种方法动态添加option:

方法一:JS方法添加

1、创建select标签

var select = documnet.createElement('select');

2、给select添加id

select.setAttribute('id','selectid');

3、给select添加onchange事件

select.setAttribute('onchange','change();');

4、将select添加到body里面

document.body.appendChild(select);

5、给select里面动态添加option

select.options.add(new Option('label','value'));

方法二:Jquery方法添加

页面已经有select标签,可以直接往里面添加option。

$('#selectid').append('text');

两种方法获取选中的option的值和value

方法一:js方法获取

1、获取select对象

var select = document.getElementById('selectid');

2、获取选中的option的索引值

var index = select.selectedIndex;

3、获取选中option的value

var selectedValue = select.options[index].value;

4、获取选中option的text

vat selectedText = select.options[index].text;

方法二:jQuery方式获取

1、获取选中的option

var select = $('#selectid option:selected');

2、获取选中option的value

var selectValue = select.val();

3、获取选中option的text

var selectedText = select.text();

一个小例子:

window.onload = function(){ //动态的往select里面添加option(JS方式添加) var select = document.createElement("select"); select.setAttribute('id','sc'); select.setAttribute('onchange','change()'); document.body.appendChild(select); for(var n = 1;n


【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有