//遍历option和添加、移除option
function changeShipMethod(shipping){
var len = $("select[@name=ISHIPTYPE] option").length
if(shipping.value != "CA"){
$("select[@name=ISHIPTYPE] option").each(function(){
if($(this).val() == 111){
$(this).remove();
}
});
}else{
$("<option value='111'>UPS Ground</option>").appendTo($("select[@name=ISHIPTYPE]"));
}
}
//取得下拉选单的选取值
$(#testSelect option:selected').text();
或$("#testSelect").find('option:selected').text();
或$("#testSelect").val();
//////////////////////////////////////////////////////////////////
记性不好的可以收藏下:
1,下拉框:
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
稍微解释一下:
1.select[@name='country'] option[@selected] 表示具有name 属性,
并且该属性值为'country' 的select元素 里面的具有selected 属性的option 元素;
可以看出有@开头的就表示后面跟的是属性。
2,单选框:
$("input[@type=radio][@checked]").val(); //得到单选框的选中项的值(注意中间没有空格)
$("input[@type=radio][@value=2]").attr("checked",'checked'); //设置单选框value=2的为选中状态.(注意中间没有空格)
3,复选框:
$("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){} //判断是否已经打勾
当然jquery的选择器是强大的. 还有很多方法.
<script src="jquery-1.2.1.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("#selectTest").change(function()
{
//alert("Hello");
//alert($("#selectTest").attr("name"));
//$("a").attr("href","xx.html");
//window.location.href="xx.html";
//alert($("#selectTest").val());
alert($("#selectTest option[@selected]").text());
$("#selectTest").attr("value", "2");
});
});
</script>
<a href="#">aaass</a>
<!--下拉框-->
<select id="selectTest" name="selectTest">
<option value="1">11</option>
<option value="2">22</option>
<option value="3">33</option>
<option value="4">44</option>
<option value="5">55</option>
<option value="6">66</option>
</select>
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<optionvalue='1'>1111</option><optionvalue='2'> 2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框
获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框
分享到:
相关推荐
总结来说,`jQuery Select2`组件以其强大的功能、良好的用户体验和高度的可定制性,成为了网页开发中不可或缺的工具。通过熟练掌握其使用方法和配置选项,开发者可以轻松地提升下拉菜单的交互性和美观度。
考虑到实际项目中可能面临的浏览器兼容性问题,jQuery超级Select插件v4.0版本致力于兼容主流的现代浏览器,同时也尽可能对旧版浏览器提供支持。此外,它在性能上做了优化,如延迟初始化、虚拟DOM技术等,以确保在大...
总结,`jquery.selectlist.js`是一个优秀的Select下拉框优化工具,尤其在兼容性和交互性方面表现出色。虽然随着前端技术的发展,原生浏览器支持越来越好,但面对复杂的项目需求和旧环境的兼容问题,此类插件仍是一把...
### jQuery 操作 Select Option 整理 #### 一、引言 在Web开发中,`<select>`元素作为用户交互的重要部分,常用于提供一系列选项供用户选择。jQuery作为一种流行的JavaScript库,极大地简化了DOM操作的过程,使得...
在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括对`<select>`标签的操作。本文将详细讲解如何使用jQuery来管理HTML中的`<select>`元素,包括选择、更改选项,获取选中项的文本、值...
以下是一个综合实例,展示了如何使用jQuery监听select元素的变化,并在变化时获取选中的option的文本或值,并对select进行一些基本操作: ```javascript <script src="jquery-1.2.1.js" type="text/javascript"> $...
总结来说,使用jQuery模拟`<select>`效果主要涉及以下几个关键点: 1. 创建一个自定义的HTML结构,例如`<div>`包裹一个`<input>`和一个隐藏的`<ul>`。 2. 使用jQuery事件处理函数(如`click`和`keyup`)来响应用户的...
总结来说,“JQuery版的select下拉效果”是通过`jquery.select.js`插件实现的一种前端技术,它提高了网页中下拉框的可定制性和用户体验。通过合理地应用这个插件,开发者可以创造出与网站或应用风格一致且功能强大的...
总结,`jQuery Nice Select`插件是前端开发者优化用户体验的一个有力工具,通过简单几步操作,就能让原本平淡无奇的`<select>`元素焕然一新,提升界面的美观度和专业感。在实际开发中,我们应充分利用这类插件,提升...
本篇文章将详细介绍如何利用 jQuery 来获取 Select 标签的值以及相关的表单元素操作。 #### 一、获取 Select 标签的值 ##### 1. 获取 Select 的 Value 值 要获取 Select 下拉框的当前选中值(即 value 属性的值)...
总结,jQuery combo-select是提升Web应用交互性的重要工具。通过理解其工作原理,熟练掌握使用方法,并结合项目需求进行定制扩展,我们可以创建出更加智能、便捷的用户界面,提高用户满意度。在不断发展的前端技术...
jQuery的语法设计使得开发者能够快速地对页面元素进行选择、操作和美化。 ### Combo Select 插件特性 1. **模糊搜索**:用户在输入框中输入关键词,插件会实时更新下拉列表,显示与关键词匹配的选项,实现快速定位...
总结,jQuery.Select插件是提升`<select>`元素功能和用户体验的强大工具,它的易用性、灵活性和广泛的浏览器兼容性使其成为开发者的得力助手。通过掌握其使用方法和特性,开发者可以更高效地构建交互丰富的网页应用...
总结来说,使用jQuery可以方便地将input文本框模拟成select选择框,实现与真实下拉框类似的功能。这主要通过动态操作DOM、添加事件监听器以及使用插件来完成。在实际项目中,根据具体需求选择合适的方法,并注重用户...
8. 总结:通过使用jQuery的事件委托技术,开发者可以有效地为动态生成的元素添加事件处理器。这种方式不仅节省了资源,还提高了代码的效率和可维护性。在实际开发中,这种方法被广泛应用于各种需要动态内容更新的...
总结,jQuery自定义Select控件的核心在于使用JavaScript和CSS构建一个新的交互组件,通过监听事件来模拟原生Select的功能。同时,我们可以根据实际需求进行扩展,以满足更复杂的应用场景。通过这种方式,我们不仅...
通过jQuery,我们可以利用DOM操作和事件处理,创建更灵活、可定制的Select替代方案。这个插件可能包括以下核心功能: 1. **元素构建**:使用`<div>`、`<ul>`等HTML元素模拟Select的外观,每个选项用`<li>`表示。 2....
总结起来,jQuery黑白两种响应式手机下拉框select的实现涉及到响应式设计原则、自定义CSS样式以及利用jQuery进行事件处理和DOM操作。这个过程不仅提升了用户体验,也展示了jQuery在增强网页交互性方面的强大能力。
总结来说,"jQuery inputbox表单美化插件自定义select框"是一个实用的工具,它帮助开发者轻松地将平淡无奇的HTML select元素转化为符合现代审美和交互习惯的组件。结合jQuery的强大功能,这个插件能够显著提升表单的...
总结来说,jQuery通过一系列简洁高效的方法,极大地简化了对select元素及其option的操作,极大地提升了Web开发的效率和便捷性。通过本文的介绍,开发者可以更好地理解和应用jQuery进行DOM操作,优化网页交互体验。