如何用jquery获取<input id="test" name="test" type="text">中输入的值

如何用jquery获取<input id="test" name="test" type="text">中输入的值,第1张

这个问题包含两个方面:

1、jquery选择器(即针对你指定的那个input元素)

2、获取内容(即获得输入的值),所以综合起来有如下代码可以实现

具体 *** 作如下:

1、创建一个文本框和一个触发获取文本框输入内容的按钮

2、简单设置一下css样式

3、添加jquery代码

扩展资料

js获取文本框值

1通过getElementById() 方法获得,必须为文本框设定ID值,该方法获得的是一个对象的应用(返回值为:Object),要获得文本框的值需添加属性值--value,如:

<input type="text" size="10" id="port11" name="port11" />

获值代码:documentgetElementById("port11")value;

2、要获得标签<h1>中间的值,方法如下:

<h1 id="you">12345</h1>

documentgetElementById("you")innerHTML;

返回值为:12345

3、如果是表单(<form>)中的文本框,还可以通过以下方式获得值:

<form name="form1" method="post" action="managerdoaction=login">

<tr><td >会员编号:</td>

<td ><input name="memberNo" type="text" id="memberNo" size="21" ></td>

<td ><input name="Submit" type="submit" value="确定" onClick="return check(form1)"

</tr>

</form>

js中的代码:function check(form){var str = formmemberNovalue;}

百度百科-jQuery

你这是用服务器控件的id,而js只认得html控件的id,这两个id是不同的,你可以把服务器控件改为html控件,或者使用<%=CheckBox7ClientID %>获取服务器控件的html页面Id

扩展comboboxdefaultsrules

2在combobox的data-options里加上validType

但是,你得在提交页面的时候进行页面验证。

jQuery 简介

jQuery 是一个 JavaScript 函数库。

jQuery 库包含以下特性:

1HTML 元素选取

2HTML 元素 *** 作

3CSS *** 作

4HTML 事件函数

5JavaScript 特效和动画

6HTML DOM 遍历和修改

7AJAX

8Utilities

jQuery实例

<html>

<head>

<script type="text/javascript" src="jqueryjs"></script>

<script type="text/javascript">

$(document)ready(function(){

$("button")click(function(){

$("p")hide();

});

});

</script>

</head>

<body>

<h2>This is a heading</h2>

<p>This is a paragraph</p>

<p>This is another paragraph</p>

<button type="button">Click me</button>

</body>

</html>

批量删除的话,给你优化一下,在页面的上边加一个批量删除的按钮,在你的每一个checkbox中加上一个value值,value值为本挑信息的id,点击批量删除时触发js,在js中这样写:

var checkAll = cjdocumentgetElementsByName("check");

var check="";

for(var i=0;i<checkAlllength;i++){

if(checkAll[i]checked){

check+=checkAll[i]value+",";

}

}

windowlocationhref="此处写你要删除的actioncheck="+check;

跳转action后,在里边得到check参数,String check = requestgetAttribute("check")toString();

切割字符串得到选中的id值:String []checkAll = check split(",");

下边用for循环删除就可以了。

for(int i=0;i<checkAlllength;i++){

int id = checkAll[i];

//对象的id得到了,在这里调用你的删除对象的方法。

}

获取对象的话,id和name都可以,一般用id的比较多

id获取 : $("#xxx")

name获取 : $("[name=xxx]")

1、checkbox日常jquery *** 作。

现在我们以下面的html为例进行checkbox的 *** 作。

<input id="checkAll" type="checkbox" />全选

<input name="subBox" type="checkbox" />项1

<input name="subBox" type="checkbox" />项2

<input name="subBox" type="checkbox" />项3

<input name="subBox" type="checkbox" />项4

全选和全部选代码:

<script type="text/javascript">

$(function() {

$("#checkAll")click(function() {

$('input[name="subBox"]')attr("checked",thischecked);

});

var $subBox = $("input[name='subBox']");

$subBoxclick(function(){

$("#checkAll")attr("checked",$subBoxlength == $("input[name='subBox']:checked")length true : false);

});

});

</script>

checkbox属性:

var val = $("#checkAll")val();// 获取指定id的复选框的值

var isSelected = $("#checkAll")attr("checked"); // 判断id=checkAll的那个复选框是否处于选中状态,选中则isSelected=true;否则isSelected=false;

$("#checkAll")attr("checked", true);// or

$("#checkAll")attr("checked", 'checked');// 将id=checkbox_id3的那个复选框选中,即打勾

$("#checkAll")attr("checked", false);// or

$("#checkAll")attr("checked", '');// 将id=checkbox_id3的那个复选框不选中,即不打勾

$("input[name=subBox][value=3]")attr("checked", 'checked');// 将name=subBox, value=3 的那个复选框选中,即打勾

$("input[name=subBox][value=3]")attr("checked", '');// 将name=subBox, value=3 的那个复选框不选中,即不打勾

$("input[type=checkbox][name=subBox]")get(2)checked = true;// 设置index = 2,即第三项为选中状态

$("input[type=checkbox]:checked")each(function(){ //由于复选框一般选中的是多个,所以可以循环输出选中的值

alert($(this)val());

});

2、radio的jquery日常 *** 作及属性

我们仍然以下面的html为例:

<input type="radio" name="radio" id="radio1" value="1" />1

<input type="radio" name="radio" id="radio2" value="2" />2

<input type="radio" name="radio" id="radio3" value="3" />3

<input type="radio" name="radio" id="radio4" value="4" />4

radio *** 作如下:

$("input[name=radio]:eq(0)")attr("checked",'checked'); //这样就是第一个选中咯。

//jquery中,radio的选中与否和checkbox是一样的。

$("#radio1")attr("checked","checked");

$("#radio1")removeAttr("checked");

$("input[type='radio'][name='radio']:checked")length == 0 "没有任何单选框被选中" : "已经有选中";

$('input[type="radio"][name="radio"]:checked')val(); // 获取一组radio被选中项的值

$("input[type='radio'][name='radio'][value='2']")attr("checked", "checked");// 设置value = 2的一项为选中

$("#radio2")attr("checked", "checked"); // 设置id=radio2的一项为选中

$("input[type='radio'][name='radio']")get(1)checked = true; // 设置index = 1,即第二项为当前选中

var isChecked = $("#radio2")attr("checked");// id=radio2的一项处于选中状态则isChecked = true, 否则isChecked = false;

var isChecked = $("input[type='radio'][name='radio'][value='2']")attr("checked");// value=2的一项处于选中状态则isChecked = true, 否则isChecked = false;

3、select下拉框的日常jquery *** 作

select *** 作相比checkbox和radio要相对麻烦一些,我们仍然以下面的html为例来说明:

<select name="select" id="select_id" style="width: 100px;">

<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>

看select的如下属性:

$("#select_id")change(function(){ // 1为Select添加事件,当选择其中一项时触发

//code

});

var checkValue = $("#select_id")val(); // 2获取Select选中项的Value

var checkText = $("#select_id :selected")text(); // 3获取Select选中项的Text

var checkIndex = $("#select_id")attr("selectedIndex"); // 4获取Select选中项的索引值,或者:$("#select_id")get(0)selectedIndex;

var maxIndex =$("#select_id :last")get(0)index; // 5获取Select最大的索引值

/

jQuery设置Select的选中项

/

$("#select_id")get(0)selectedIndex = 1; // 1设置Select索引值为1的项选中

$("#select_id")val(4); // 2设置Select的Value值为4的项选中

/

jQuery添加/删除Select的Option项

/

$("#select_id")append("<option value='新增'>新增option</option>"); // 1为Select追加一个Option(下拉项)

$("#select_id")prepend("<option value='请选择'>请选择</option>"); // 2为Select插入一个Option(第一个位置)

$("#select_id")get(0)remove(1); // 3删除Select中索引值为1的Option(第二个)

$("#select_id :last")remove(); // 4删除Select中索引值最大Option(最后一个)

$("#select_id [value='3']")remove(); // 5删除Select中Value='3'的Option

$("#select_id")empty();

$("#select_id")find("option:selected")text(); // 获取select 选中的 text :

$("#select_id")val(); // 获取select选中的 value:

$("#select_id")get(0)selectedIndex; // 获取select选中的索引:

//设置select 选中的value:

$("#select_id")attr("value","Normal");

$("#select_id")val("Normal");

$("#select_id")get(0)value = value;

//设置select 选中的text,通常可以在select回填中使用

var numId=33 //设置text==33的选中!

var count=$("#select_id option")length;

for(var i=0;i<count;i++)

{ if($("#select_id")get(0)options[i]text == numId)

{

$("#select_id")get(0)options[i]selected = true;

break;

}

}

通过上面的总结,应该对jquery的checkbox,radio和select有了一定的了解了吧,温故而知新,用多了就会变的熟练起来,即使有时候忘记了,也可以来翻一翻!

以上就是关于如何用jquery获取<input id="test" name="test" type="text"/>中输入的值全部的内容,包括:如何用jquery获取<input id="test" name="test" type="text"/>中输入的值、jquery获取id 获取不到、jquery 自定义validatebox的validType属性等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9637932.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-30
下一篇 2023-04-30

发表评论

登录后才能评论

评论列表(0条)

保存