`
hugang357
  • 浏览: 187480 次
  • 性别: Icon_minigender_2
  • 来自: 深圳
社区版块
存档分类
最新评论

请您先登录,才能继续操作

JQuery 常用操作代码

阅读更多
这是jquery常用的一些操作代码总结:

//遍历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常用代码片段

    这篇博文"jQuery常用代码片段"很可能是为了分享一些实用的jQuery代码示例,帮助开发者提高工作效率。下面我们将深入探讨jQuery的一些核心功能和常见用法。 1. **选择器**: jQuery的选择器类似于CSS,可以轻松地选取...

    jQuery 常用代码段

    6. **链式操作**:jQuery的一个显著特点是链式调用,如`$("#element").addClass("myClass").css("color", "red")`,这使得代码更简洁。 7. **遍历和过滤**:`each()`函数用于遍历集合中的每个元素,`filter()`和`...

    75款常用的jquery特效前端网页代码

    本资源“75款常用的jquery特效前端网页代码”提供了丰富的示例,帮助开发者快速实现各种前端交互功能。 1. **jQuery基础**:jQuery的核心是其简洁的API,它使得JavaScript代码更加简洁易读。通过选择器选取DOM元素...

    jquery常用插件包

    这个“jquery常用插件包”包含了几个重要的jQuery插件的源代码,包括dialog对话框插件、menu菜单插件以及tabs选项卡插件,这些都是网页交互设计中常用的组件。 首先,让我们详细探讨一下jQuery库的基础知识。jQuery...

    jQuery实现在线考试答题代码.zip

    开发周期短,上手快,入门低,但是进阶难一般常用的jquery特效 jquery焦点图 jquery选项卡 jquery滚动条 jquery下拉广告,jquery图片延时加载等,jquery代码,放大镜特效,jquery广告代码,jquery导航,jquery在线客服...

    jQueryDemo(JQuery常用操作2005)

    《jQueryDemo:深入理解JQuery常用操作》 jQuery,作为一款强大的JavaScript库,极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。在"jQueryDemo(JQuery常用操作2005)"中,我们将深入探讨jQuery...

    Jquery演示 jquerydemo jquery常用

    jQuery 是一个高效、简洁且功能丰富的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。本篇文章将围绕"jQuery演示"这一主题,深入探讨jQuery的核心知识点,并通过实际案例来帮助你...

    jQuery常用功能大全

    ### jQuery常用功能详解 #### 一、页面元素的引用 在使用jQuery时,最基础的操作之一就是选择页面上的元素。这通常通过`$()`符号来完成。jQuery的强大之处在于它支持多种选择器语法,比如: - **ID选择器**:通过...

    jQuery初学实例代码集

    这些实例代码是学习jQuery的良好起点,通过实践,初学者可以快速理解并掌握jQuery的核心概念和常用方法,从而提升网页开发的效率和质量。同时,收藏这些实例代码,可以在未来的工作中随时查阅,作为宝贵的参考资料。

    jquery自动切换代码

    ### jQuery自动切换代码知识点解析 #### 一、前端开发与jQuery简介 在前端开发领域,JavaScript是最核心的技术之一。随着互联网技术的发展,JavaScript及其相关的框架和库变得越来越重要。jQuery作为一个快速、...

    jQuery 常用代码集锦(必看篇)

    通过这些常用代码的示例,开发者可以在日常开发工作中快速应用这些功能,提高工作效率。由于是OCR扫描文本可能存在一些字词识别错误,因此在实际使用时,开发者需要根据上下文对代码进行适当调整和完善。在使用这些...

    常用的几个jquery版本文件

    jQuery将JavaScript的DOM操作、事件处理、动画制作和Ajax整合在一起,使得开发者可以快速编写出高效且可维护的代码。 2. jQuery版本的选择: - jQuery 1.x系列:这是最早的稳定版本,兼容性较好,支持IE6/7/8等老...

    15个jquery常用案例源码

    这里我们探讨的"15个jquery常用案例源码"集合,提供了多种实用功能的示例代码,可以帮助开发者快速理解和应用jQuery在实际项目中的各种场景。 1. **百度搜索下拉代码**:这个案例模拟了百度搜索框的下拉提示功能,...

    前端常用Jquery代码

    这个"前端常用jQuery代码"压缩包显然包含了大量实用的代码片段,适用于各种网页特效的实现,帮助开发者快速构建功能丰富的网站。 jQuery的核心特性包括选择器、DOM操作、事件处理、动画效果以及Ajax交互。选择器是...

    一键下载75款常用的jquery特效前端网页代码

    本资源集合提供了75款常用的jQuery特效前端网页代码,对于网页开发者来说,这是一个宝贵的资源库,可以帮助快速实现各种网页交互和视觉效果。 1. **jQuery的选择器**:jQuery提供了丰富的选择器,如ID选择器(#id),...

    Jquery,C#异步刷新源代码

    本资源包含的是使用Jquery和C#实现的异步刷新源代码,以下是关于这两个技术以及它们如何协同工作的详细解释。 1. **Jquery**: Jquery是一个流行的JavaScript库,简化了DOM操作、事件处理、动画和Ajax交互。在异步...

    jquery常用小例子

    jQuery是一个广泛应用于Web开发的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。本教程将通过几个常见的jQuery小例子,深入解析jQuery的核心功能及其使用方法。 1. **选择器**:...

    门户网站jQuery相册代码相册图片切换代码下载

    本资源提供的是一个专为门户网站设计的jQuery相册代码,帮助开发者实现图片切换功能,提升用户体验。下面将详细介绍这个jQuery相册代码的工作原理、实现方式以及如何将其应用到实际项目中。 1. jQuery基础:jQuery...

Global site tag (gtag.js) - Google Analytics