1.判断SELECT是否存在值为reqVal的item.
function checkItemIsExit(selObj,reqVal){
var flag = false;
for(var i=0;i<selObj.options.length;i++){
if(selObj.options[i].value==reqVal){
flag = true;
break;
}
}
return flag;
}
2.给SELECT增加一个Option
function addItem(selObj,reqText,reqVal){
if(checkItemIsExit(selObj,reqVal)){
alert('值为'+reqVal+'的SELECT框存在了!');
}else{
var option = new Option(reqText,reqVal);
selObj.options.add(option);
}
}
3.得到select的当前选中项的text
var text = selObj.options[selObj.selectedIndex].text;
4.选中VALUE=reqVal的SELECT的option
function SelectItemByVal(selObj,reqVal){
for(var i=0;i<selObj.options.length;i++){
if(selObj.options[i].value=reqVal){
selObj.options[i].selected=true;
break;
}
}
}
5.删除VALUE=reqVal的item
function removeItemByValue(selObj,reqVal){
var flag = false;
alert(reqVal);
for(var i=0;i<selObj.options.length;i++){
if(selObj.options[i].value==reqVal){
selObj.options.remove(i);
flag = true;
break;
}
}
if(flag){
alert('删除成功!');
}else{
alert('删除失败!');
}
}
6. 清空SELECT 框:
function clearSel(selObj){
selObj.options.length=0;
}
7.获得当前SELECT框的值:
var value = selObj.value;
更改SELECT在页面上的显示方式:
<select name="holiday" id="holiday" style="width:300px;height: 80px;" size=10>
<option value="-1">请选择节日</option>
</select>
分享到:
相关推荐
#### 四、小结 通过上述详细介绍,我们可以看到利用JavaScript和jQuery操作`<select>`元素十分灵活且功能强大。这些技术不仅适用于简单的表单处理,还能够支持复杂的动态数据绑定和用户交互设计。希望本篇文档能帮助...
### 小结 通过这篇文档,我们可以了解到如何在Vue.js项目中结合Layui的表单组件来实现select的动态加载,并通过一些编程技巧解决前后端渲染时间差的问题。此外,还学习到如何使用axios来处理HTTP请求,并利用Vue的...
在现代网页设计中,JavaScript库jQuery极大地方便了开发人员对网页元素的操作。特别是在处理HTML的SELECT元素时,jQuery提供了一系列简单有效的方法来控制select下拉列表,包括获取选中项的文本和值、设置选中项、...
一基础理解: var e = document.getElementById(“selectId”); e. options= new Option(“文本”,”值”) ;...selectedIndex属性——–当前被选中的框中的文本的索引值,此索引值是内存自动分配的(0,
jQuery不仅对select元素提供了便利的操作方法,对于单选框和复选框也有类似的操作。例如,使用“$("input[@type=radio][@checked]").val()”可以获取选中的单选框的值,而“$("input[@type=checkbox][@checked]")....
jQuery是一种快速、简洁的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画和Ajax交互等操作。在前端开发中,Select下拉框是常见的表单元素,用于选择列表中的一个或多个选项。本文将详细介绍如何使用...
知识点一:获取select中选中的option的value和text 在html中,select元素中的option元素可以通过value属性设置一个值,同时,option元素显示的文本内容则是option元素的子节点。使用jquery获取select元素中选中的...
《Select2.js下拉框使用详解》 ...总的来说,Select2.js提供了丰富的功能,使得下拉框的选择操作更加灵活和人性化。通过理解和应用上述知识,开发者能够构建出交互性强、用户体验优秀的下拉框组件。
这篇“javascript框架小结”是作者萧枫的工作经验分享,他为JavaScript的全局对象XiaoFeng添加了一系列实用方法,从而构建了一个自定义的JavaScript框架。 首先,XiaoFeng\System中添加了一个名为Scroll的方法,...
例如,通过设置`minimumInputLength`来限制搜索框在用户输入一定字符后才开始搜索,或者监听`select2:select`事件来执行特定操作。 总的来说,Bootstrap和Select2的组合为开发者提供了强大的工具,使得创建功能丰富...
本文主要探讨了如何使用jQuery来操作常见的表单元素,如单选框、多选框和文本框,帮助开发者更高效地实现功能。 首先,我们来看一下jQuery如何处理单选框(Radio Buttons)和多选框(Checkboxes)。对于单选框,...
JavaScript中的TextRange对象是一个用于操作HTML文档中文本流的重要接口,它允许开发者对页面中的文本执行一系列操作,如选择、搜索和修改。TextRange对象属于动态HTML(DHTML)的一部分,能够帮助开发者实现更加...
这篇博客"jquery取单选,复选,下拉小结"是关于如何使用jQuery来操作网页中的单选按钮(radio)、复选框(checkbox)以及下拉列表(select)的选择项。下面我们将详细探讨这些知识点。 首先,我们来讨论如何使用...
第一部分 深入理解DOM脚本编程 第1章 遵循最佳实践 1.1 不唐突和渐进增强 1.2 让JavaScript运行起来 1.2.1 把行为从结构中分离出来 1.2.2 不要版本检测 ... 12.9 小结
### jQuery Mobile 经验小结 #### 一、概述 jQuery Mobile 是一款基于 HTML5 的移动设备框架,它为开发者提供了构建响应式网站、应用程序的能力。通过使用 jQuery Mobile,可以轻松地创建适用于不同屏幕尺寸的网页...