jquery获取选中的文本和值

jquery获取选中的文本和值

1、说明

(1)获取select下拉框选中的索引

      $("#selection").get(0).selectedIndex;

(2)获取select下拉框选中的值

     $("#selection option:selected").val();

(3)获取select下拉框选中的文本

    $("#selection option:selected").text();

2、实现源码

<!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>jQuery获取选中的文本和值</title>
<script type="text/javascript" src="../Documents/未命名站点 2/jquery-1.11.0.js"></script>
<script type="text/javascript">
    $(function(){
	     $("#btn").click(function(){
			   //获取select下拉框索引
		       var index = $("#selection").get(0).selectedIndex;
			   //获取select下拉框的值
			   var selectVal = $("#selection option:selected").val();
			   //获取select下拉框的文本
			   var selectText = $("#selection option:selected").text();
			   alert("获取select下拉框索引:" + index + "\n" + "获取select下拉框的值:" + selectVal + "\n" + "获取select下拉框的文本:" + selectText);
		 });
	});
</script>
</head>

<body>
   <div id="select_val">
       <select id="selection">
             <option value="0">鲤鱼</option>
             <option value="1">鳐鱼</option>
             <option value="2">鲶鱼</option>
             <option value="3">棒棒鱼</option>
             <option value="4">小姐鱼</option>
             <option value="5">红金花罗汉鱼</option>
             <option value="6">彩虹王罗汉鱼</option>
             <option value="7">泰金罗汉鱼</option>
       </select>
   </div>
   <input type="button" value="获取选中的文本和值" id="btn"/>
</body>
</html>

3、实现结果

(1)选中第一项

(2)选中最后一项

jquery获取选中的文本和值

时间: 2024-07-29 13:17:50

jquery获取选中的文本和值的相关文章

Jquery获取选中的checkbox的值

1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 3 <html> 4 <head> 5 <title>checkbox</title>

jQuery设置和获取HTML、文本和值

jQuery设置和获取HTML.文本和值 按 Ctrl+C 复制代码 <script type="text/javascript"> //<![CDATA[ $(function(){ //获取<p>元素的HTML代码 $("input:eq(0)").click(function(){ alert( $("p").html() ); }); //获取<p>元素的文本 $("input:eq(1

jquery获取选中的checkbox复选框的值

jquery获取选中的checkbox复选框的值:checkbox复选框是常用的表单元素之一,既然使用,一般就要获取选中的复选框的值,下面就介绍一下如何使用jQuery实现此功能.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/

jQuery如何获取选中单选按钮radio的值

jQuery如何获取选中单选按钮radio的值:下面介绍一下如何获取选中的单选按钮的值,代码非常简单.代码如下: var theradioValue=$('input:radio[name="theradio"]:checked').val(); 以上代码可以获取被选中的name属性值为theradio的单选按钮的值. 原文地址是:http://www.51texiao.cn/jqueryjiaocheng/2015/0523/2393.html 最原始地址是:http://www.s

js如何获取选中radio单选按钮的值

js如何获取选中radio单选按钮的值:radio单选按钮在是非常常用的表单元素之一,经常需要获取被选中按钮的value属性值,下面就通过实例简单介绍一下如何使用javascript实现此功能,代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.soft

jquery获取当前选项的属性值a

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"><

jquery取选中的checkbox的值

一.   在html的checkbox里,选中的话会有属性checked="checked". 如果用一个checkbox被选中,alert这个checkbox的属性"checked"的值alert($"#xxx".attr("checked")),会打印出"true",而不是"checked"! 如果没被选中,打印出的是"undefined".觉得很奇怪是吗?继续看

jQuery获取Table某列的值

在写此篇博文时,发现在以前曾写过<获取DataTable选择第一行某一列值>http://www.cnblogs.com/insus/p/5434062.html . 但是与此篇所说的完全不一样.这篇Insus.NET需要的是jQuery去获取html table的某一行某一列的数据. 如下表: Html code: <table> <tr> <th style="width:10px;"><input id="Selec

dView实现checkbox全选反选(自带的ShowSelectCheckBOx)并获取选中checkbox对应的值集合

第一步,显示checkbox按钮: 点击AspxGridView的columns,你可以直接选择增加一行Command Column或者随便选择一种然后点击Change To Commadn Column;默认的ShowSelectCheckBOx是true,我们可以不用管,这样你就看到每行都有checkBox按钮了. 第二步,表头部显示CheckBox,点击实现全选|反选功能: 我们切换回源代码,找到AspxGridView的GridViewCommandColumn列,在该列中增加 <Hea