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获取选中的文本和值的更多相关文章

  1. Jquery获取选中的文本值

    $(document).ready(function() { $(".contenttext").mouseup(function(e) { var txt; var parent ...

  2. Jquery获取选中的checkbox的值

    <%@ page language="java" import="java.util.*" pageEncoding="utf-8"% ...

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

    jQuery设置和获取HTML.文本和值 按 Ctrl+C 复制代码 <script type="text/javascript"> //<![CDATA[ $( ...

  4. jQuery获取Radio选择的Value值||两个select之间option的互相添加操作(jquery实现)

    jQuery获取Radio选择的Value值: 1. $("input[name='radio_name'][checked]").val();  //选择被选中Radio的Val ...

  5. js与jquery获取input输入框中的值

    如何用javascript获取input输入框中的值,js/jq通过name.id.class获取input输入框中的value 先准备一段 HTML 一.jquery获取input文本框中的值 通过 ...

  6. 如何用jquery获取页面下HiddenField的值··

    怎么用jquery获取页面上HiddenField的值·· 怎么用jquery获取页面上HiddenField的值··?HiddenField的值是从后台赋值的··· 先赋值给Hiddenfield ...

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

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  8. JS和Jquery获取和修改label的值的示例代码

    abel标签在JS和Jquery中使用不能像其他标签一样用value获取它的值,下面有个不错的示例,希望大家可以学习下 来源:  <  JS和Jquery获取和修改label的值的示例代码  & ...

  9. Jquery获取select选中的文本与值

    jquery获取select选择的文本与值获取select :获取select 选中的 text :    $("#ddlregtype").find("option:s ...

随机推荐

  1. MySQL用户授权与权限

    MySQL权限如下表 权限名字 权限说明 Context CREATE 允许创建新的数据库和表 Databases, tables, or indexes DROP 允许删除现有数据库.表和视图 Da ...

  2. Spring源码情操陶冶-自定义节点的解析

    本文承接前文Spring源码情操陶冶-DefaultBeanDefinitionDocumentReader#parseBeanDefinitions,特开辟出一块新地来啃啃这块有意思的骨头 自定义节 ...

  3. apache配置详解

    可参考:Apache 的 httpd.conf 详解 ServerTokens OS 此指令控制了Server回送给客户端的回应头域是否包含关于服务器OS类型和编译进的模块描述信息.服务器会发送:Se ...

  4. 洛谷 [P3033] 牛的障碍

    利用二分图匹配求最大独立集 本题的边一定平行于坐标轴,且同向的线段一定不重合,这是经典的二分图建图方法,本题要求的是最大不重合的线段数,那就是求二分图的最大独立集,最大独立集=总点数-最大匹配数. 本 ...

  5. Kitty猫基因编码

    原题链接:https://www.luogu.org/problemnew/show/2562#sub 简单的递归题.记录一下前缀和然后二分求解就好. 参考代码: #include <iostr ...

  6. testlink用例的导出到Excel

    一直在网上寻找怎么把testlink的用例导出到Excel中,以及把Excel中已经写好的用例导入到Testlink中的方法.根据现网的经验,然后修改了一下.贴出来,以飨有这方面需求的测试同仁. Te ...

  7. 怎么理解np.random.seed()?

    在使用numpy时,难免会用到随机数生成器.我一直对np.random.seed(),随机数种子搞不懂.很多博客也就粗略的说,利用随机数种子,每次生成的随机数相同. 我有两个疑惑:1, 利用随机数种子 ...

  8. UEditor工具栏上自定义按钮、图标、事件和右击菜单添加自定义按钮

    首先我要说是,举例说的这个版本是1.2以上的,因为一些配置代码转移到了zh-cn.js里,其他没有变化.开门见山直接写:(我自定义的是在线美图功能) 第一步:找到ueditor.config.js文件 ...

  9. QT开发应用程序的欢迎界面

    主界面启动太慢,通常要10秒以上,所以想加个欢迎界面,等程序加载好再显示主界面. 主界面(类名为MainWindow)启动慢的原因是构造函数需要执行大量初始化的工作. 创建了Welcome类作为欢迎界 ...

  10. ConcurrentHashMap源码分析(一)

    本篇博客的目录: 前言 一:ConcurrentHashMap简介 二:ConcurrentHashMap的内部实现 三:总结 前言:HashMap很多人都熟悉吧,它是我们平时编程中高频率出现的一种集 ...