`
齐晓威_518
  • 浏览: 617807 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

jquery操作input值总结

 
阅读更多
获取选中的值
获取一组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");
$("#txt").val();
多选框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();//清空下拉框
=====================
在Jquery中,用$("#id")来获得页面的input元素,其相当于document.getElementById("element") 但是,该获取的是一个Jquery对象,而不是一个dom element对象.value是dom element对象的属性.所以,使用 $("#id").value不能取到值 取值的方法如下: 取值:val = $("#id")[0].value; $("#id")[0].value = "new value"; 赋值: $("#id")[0].value = "new value";
或者$("#id").val("new value"); val = $("#id").attr("value");
==================================
jquery input text radio check select 操作2009-04-29 15:36
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>

<script src="jquery-starterkit/lib/jquery-1.3.2.min.js" type="text/javascript"></script>

</head>

<body>
<input type="text" id="dd" name="dd" value="dds"/>dd

<input name="rr" id="rr" type="radio" value="34" />ff
<input name="rr" id="rr2" type="radio" value="4" />55

<input name="ff" type="checkbox" value="aa" />jgdg
<input name="ff" type="checkbox" value="gd" />jgdg

<select name="ss" id="ss" size="1">
<option value=""></option>
<option value="8">d</option>
<option value="2">g</option>
</select>

<br/>
<input type="button" id="button" value="按钮一" />
<input type="button" id="jj" value="按钮二" />
<br/>

<div id="ssd">fgfooHello</div>

</body>

<script language="javascript" type="text/javascript">
<!--
$(function(){
           $("#button").click(function(){
                   
                                      
//获取值
//alert( $('#dd').val());//type=text
// alert($('input[name=rr][checked]').val());//type=radio
// alert($('input[name=ff][checked]').val());//type=checkbox
// alert($("select[name=ss] option[selected]").val());//select 相等于alert($("#ss option[selected]").val());
                                   
//获取文本
//alert($("select[name=ss] option[selected]").text());//select

                                   
//控制
/*// Disable #dd 禁用
$("#dd").attr("disabled","disabled");
// Enable #dd 解禁
$("#jj").removeAttr("disabled");*/


// $('input[name=rr]').get(0).checked = true;//第一个radio被选中
//alert($("input[type=radio][value=34]").attr("checked",'checked'));//value=34的radio被选中
                                   
//alert($("input[type=checkbox][value=gd]").attr("checked",'checked'));//value=gd的checkbox被选中
//$('input[name=ff]').get(1).checked = true;//第一个check被选中
                                   
                                   
                                   
/*//根据option的text选中option
count=$("#ss").find("option").length;
for(var i=0;i<count;i++)
{          
if($("#ss").get(0).options[i].text == 'd')
{
    $("#ss").get(0).options[i].selected = true;
        
     break;
}
} */
       
//$("<option value='1'>1111</option><option value='25'>22s22</option>").appendTo("#ss");//增加option
//$("#ss option[value=8]").remove("");//除去 <option value='8'>d</option>
       
//$("#ss").attr("value",'2');//选中option                           
//$('#ss')[0].selectedIndex = 1;//选中option
               
//$("#ss").empty();//清空全部option
           
/*//替换文本
var $thirdLink = $("#ssd");
var linkText = $thirdLink.text().replace('foo','bar');
$thirdLink.text(linkText); */

               
       
    });      
});
-->
</script>
</html>
分享到:
评论

相关推荐

    jQuery操作input值的各种方法总结

    获取选中的值获取一组radio被选中项的值 代码如下:var item = $(‘input[@name=items][@checked]’).val();获取select被选中项的文本 代码如下:var item = $(“select[@name=items] option[@selected]”).text();...

    JavaScript和jQuery获取input框的绝对位置

    总结起来,JavaScript和jQuery提供了多种方式来获取`input`框的绝对位置,包括`getBoundingClientRect()`配合滚动距离计算,以及jQuery的`offset()`方法。开发者可以根据项目需求和浏览器兼容性选择合适的方法。

    jquery获取表单值

    ### jQuery 获取表单值 在Web开发中,jQuery作为一个非常流行的JavaScript库,简化了许多复杂的DOM操作,特别是对于表单数据的获取与处理方面提供了极大的便利。本文将详细讲解如何使用jQuery来获取不同类型的表单...

    jquery input文本框模拟select选择框获取选定

    总结来说,使用jQuery可以方便地将input文本框模拟成select选择框,实现与真实下拉框类似的功能。这主要通过动态操作DOM、添加事件监听器以及使用插件来完成。在实际项目中,根据具体需求选择合适的方法,并注重用户...

    js与jquery获取input输入框中的值实例讲解.docx

    #### 四、jQuery获取Input值 ##### 1. 通过ID获取 ```javascript $("#user").val(); ``` 这里的`#user`是`&lt;input&gt;`元素的ID。 ##### 2. 通过Name获取 ```javascript $("input[name='username']").val(); ``` ...

    jquery input下拉菜单选中效果.zip

    总结来说,通过使用jQuery,我们可以创建出具有高度定制性和交互性的input下拉菜单选中效果,这在网页开发中是非常实用的一个技巧。这个过程涉及到HTML结构、CSS样式和JavaScript/jQuery的交互逻辑,是前端开发中的...

    jQuery实现动态添加、删除按钮及input输入框的方法

    通过本篇文章,我们将学习如何使用jQuery实现动态添加和删除按钮及input输入框的方法,同时还将涉及到事件响应和页面元素动态操作的相关技巧。 首先,我们需要注意的是,当页面加载完毕后,jQuery的$(document)....

    使用jQuery给input标签设置默认值

    本文将详细介绍如何使用jQuery给input标签设置默认值,并通过实例来讲解其具体操作。 ### jQuery基础 在开始使用jQuery之前,我们先了解一些基础知识点。jQuery是一个快速、小巧且功能丰富的JavaScript库。它通过...

    jquery获取input输入框中的值

    在网页开发中,获取用户在input...希望本文能对您在开发过程中获取input值的操作提供帮助。如果您有任何问题或需要进一步的信息,请随时提问。同时,分享知识是一种美德,如果本文对您有帮助,记得分享给需要的朋友哦!

    纠错jqueryinput选择

    // 在这里编写选择和操作input元素的代码 }); ``` 同时,使用`console.log()`或`console.error()`进行调试,可以帮助识别并修复错误。 五、优化性能 对于大型项目,遍历DOM可能会导致性能问题。使用`delegate()`...

    jquery 学习笔记总结

    在 `jquery操作dom对象.doc` 和 `jquery.docx` 文件中,你可以找到更多关于 jQuery DOM 操作的具体示例,包括选择器应用、方法调用以及在实际项目中的实践案例。通过这些实例,你可以更深入地理解如何将 jQuery 应用...

    jquery操作表单案例

    本文将深入探讨“jquery操作表单案例”中的关键知识点,包括输入元素(input)、文本区域(textarea)、单选按钮(radio)、复选框(checkbox)以及选择列表(select)的操作,特别是如何根据选择列表的文本值(text)来选定选项...

    jQuery针对input的class属性写了多个值情况下的选择方法

    接下来,如果要使用jQuery来选择具有"content"和"my_sh"这两个class值的input元素,正确的选择器写法是:jQuery(".content.my_sh")。注意,在选择器中,class值"content"和"my_sh"之间不能有空格。这是因为在jQuery...

    jQuery获取及设置表单input各种类型值的方法小结

    总结来说,本文对于在使用jQuery进行表单操作时常见的获取和设置各种类型input值的方法进行了归纳,内容从基础的获取和设置值到控制元素状态的技巧都有涉及,非常适合需要进行jQuery表单编程的开发者参考。

    jQuery 知识点 总结

    ### jQuery知识点总结 #### 一、简介与基本用法 jQuery 是一款轻量级的 JavaScript 库,极大地简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。它采用直观的语法,使得开发者能够快速地完成网页开发...

    jquery获取input type=text中的值的各种方式(总结)

    总结来说,在使用jQuery操作DOM元素和获取表单值时,推荐使用id选择器和.val()方法,因为它们更加直观和高效。同时,也要了解和掌握其他各种选择器,以便在不同的开发场景下灵活运用。通过本篇文章的学习,我们能够...

    jquery实现input输入框实时输入触发事件代码

    要实现输入框(input)中的内容实时更改时触发特定的事件处理函数,可以使用JavaScript的jQuery库来简化操作。以下知识点将详细解释如何利用jQuery为input输入框绑定一个事件,该事件在用户输入时即时响应,并执行预...

    jquery input国际电话输入提示表单代码

    总结来说,“jquery input国际电话输入提示表单代码”涉及到的关键知识点包括:jQuery的选择器和方法,事件处理,DOM操作,正则表达式验证,Ajax通信,以及可能的UI库如jQuery UI或Typeahead.js的使用。实现这样的...

Global site tag (gtag.js) - Google Analytics