在进行表单元素的操作时，难免会遇到对option元素的挑选，下面的示例代码能够很好的获取到你option元素选择的值，如果要传递给后端，可通过ajax或者其他方式传递即可。
示例代码

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>获取option元素</title>

</head>

<body>

  <div class="item-content">

	<div class="item-inner">

	  <div class="item-title label">编程语言</div>

	  <div class="item-input">

		<select id="program-language">

			<option data-id="Java">Java</option>

			<option data-id="Python">Python</option>

			<option data-id="Android">Android</option>

			<option data-id="C#">C#</option>

			<option data-id="Ruby">Ruby</option>

			<option data-id="JavaScript">JavaScript</option>

		</select>

	</div>

  </div>

	<div class="content-block">

      <div class="row">

        <div class="col-50">

			<a href="#" class="button button-big button-fill button-success" id="submit">提交</a>

		</div>

      </div>

    </div>

<script type='text/javascript' src='C:/Users/Hyxiao/Desktop/option/jquery-3.2.1.js' charset='utf-8'></script>

<script type='text/javascript'>

	$('#submit').click(function() {

		var  language = '';

		language =

			$('#program-language').find('option').not(function() {

				return !this.selected;

			}).data('id')

		console.log(language);

	});

</script>

</body>

</html>

效果图如下：

获取HTML网页中option标签元素的值的更多相关文章

  1. java获取单张网页中img标签中的src

    /** * 得到网页中图片的地址 */ public static List<String> getImgStr(String htmlStr) { List<String> ...

  2. 关于Oxygen版 Eclipse JSP或html 中<option>标签嵌入jstl 如<c:if>出现报错

    Oxygen版 Eclipse JSP或html 中<option>标签嵌入jstl 如<c:if>出现报错 好好的学框架的整合,结果在<option>中加入< ...

  3. .NET获取Html字符串中指定标签的指定属性的值

    using System.Text; using System.Text.RegularExpressions; //以上为要用到的命名空间 /// <summary> /// 获取Htm ...

  4. Python 网络爬虫 009 (编程) 通过正则表达式来获取一个网页中的所有的URL链接，并下载这些URL链接的源代码

    通过 正则表达式 来获取一个网页中的所有的 URL链接,并下载这些 URL链接 的源代码 使用的系统:Windows 10 64位 Python 语言版本:Python 2.7.10 V 使用的编程 ...

  5. JS事件 什么是事件？JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。

    什么是事件 JavaScript 创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件. 比如说,当用户单击 ...

  6. C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值

    //C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值,表达式如下: Regex regImg = new Regex(@"(?is)<a[^>]*?href ...

  7. form表单元素中disabled的元素的值不会提交到服务器

    1.表单元素中disabled的元素的值不会提交到服务器,后台获取的值为null <form id="myForm" action="#" method= ...

  8. 输出有序数组的中两个元素差值为指定值diff的两个元素

    题目: 输出有序数组的中两个元素差值为指定值diff的两个元素. 思路: 这与输出两个元素的和的值为一定值类似,需要两个指针,不同的是:指针不是一左一右,而是一前一后. 如果差值等于diff,则返回: ...

  9. jquery中修改一个元素的值或内容

    jquery中修改一个元素的值或内容,比如数值增加可以使用这个方法取得原值并+1 $this.text(function(i,ot){return Number(ot)+1;});

随机推荐

  1. SoutceTree用户名或者密码输入错误解决方案

    soutceTree在拉取代码时候需要输入账户名或者密码,如果一时输入错了,可以这样修改: 1.找到这个目录:C:\Users\Administrator\AppData\Local\Atlassia ...

  2. 字符串拷贝函数递归与非递归的C语言实现

    初学递归的时候,觉得很抽象,不好分析,确实如此,尤其是有些时候控制语句不对,导致程序进去无限次的调用,更严重的是栈溢出.既要正确的控制结束语句,又要有正确的进入下次递归的语句,还要有些操作语句.... ...

  3. mycat《对应关系》

  4. spring之自定义注解

    java.lang.annotation提供了四种元注解,专门注解其他的注解: @Target –注解用于什么地方,默认值为任何元素,表示该注解用于什么地方.可用的ElementType指定参数 ,也 ...

  5. jdbc操作mysql（四）：利用反射封装

    前言 有了前面利用注解拼接sql语句,下面来看一下利用反射获取类的属性和方法 不过好像有一个问题,数据库中的表名和字段中带有下划线该如何解决呢 实践操作 工具类:获取connection对象 publ ...

  6. mybaits源码分析--自定义插件（七）

    一.MyBatis插件 插件是一种常见的扩展方式,大多数开源框架也都支持用户通过添加自定义插件的方式来扩展或者改变原有的功能,MyBatis中也提供的有插件,虽然叫插件,但是实际上是通过拦截器(Int ...

  7. nios eclipse提示LED_PIO_BASE没有声明，怎么回事？

    这是因为名字不一致引起的比如,在生成SOPC系统时,双击PIO(Parallel I/O)(在Avalon Modules -> Other 下),为系统添加输出接口,你没有把该组件改名成LED ...

  8. Nginx对代理HTTP资源的限制访问

    为了限制连接的数量,首先,使用指令来定义密钥并设置共享内存区域的参数(工作进程将使用该区域来共享键值的计数器).作为第一个参数,指定作为关键字计算的表达式.在第二个参数区域中,指定区域的名称及其大小. ...

  9. 解决win10 cmd运行python弹出windows应用商店下python应用程序

    方法一: 1.我一开始下载完python后,忘记下载到哪个位置,在win10底下输入框搜索python,点击打开文件所在位置,所在位置是python快捷键的位置,直接复制进行环境配置 配置完环境变量后 ...

  10. Pytest 系列（28）- 参数化 parametrize + @allure.title() 动态生成标题

    如果你还想从头学起Pytest,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1690628.html 前言 参数化 @pytest.ma ...