在进行表单元素的操作时，难免会遇到对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. （强制）要求覆写equals必须覆写hashCode（原理分析）

    hashCode和equals hashCode和equals用来标识对象,两个方法协同工作可用来判断两个对象是否相等.众所周知,根据生成的哈希将数据散列开来,可以使存取元素更快.对象通过调用Obje ...

  2. JDK 5.0新特性

    时间:2016-11-5 12:03 JDK5.0新特性    泛型.枚举.静态导入.自动拆装箱.增强for循环.可变参数1.Junit单元测试    测试的对象是类中的一个方法.    junit不 ...

  3. Dockerfile 实践及梳理

    Dockerfile 是一个文本文件,我们可以通过组合一条条的指令 (Instruction),来构建满足我们需求的 Docker 镜像 文档 Best practices for writing D ...

  4. 那些优秀的python代码

    时间:2019-04-18 收藏:PangYuaner 标题:Python如何生成树形图案 地址:https://www.jb51.net/article/132049.htm 标题:用python- ...

  5. 20210714 noip15

    考前 mtr 中午拿着笔记本改题(Orz),一点多发现 13.50 有比赛(截止 12 点都没放出来),赶紧睡.13.40 到了学校,巨瞌睡,洗了把脸到机房发现推迟到 14.30 了,wcnm 趴在桌 ...

  6. 20210713考试-2021noip13

    这位巨佬的博客还是比我好多了 T1 工业题 考场: 暴力挺香的,不想正解了. 题解: $f(i,j)$ 只会得到 $f(i-1,j)$ 和 $f(i,j-1)$ 的贡献.每向右一步乘 $a$ ,向下一 ...

  7. Linux常用命令 - head命令详解

    21篇测试必备的Linux常用命令,每天敲一篇,每次敲三遍,每月一循环,全都可记住!! https://www.cnblogs.com/poloyy/category/1672457.html 显示文 ...

  8. JS005. 拷贝引用数据类型Array使其指向不同堆的解决方案

    一个很常见的语法问题,但专注实现需求时经常会忘记去避免,导致最终问题的出现,再花时间排查.为此专门整理一篇解决方法的博客,也加强一下自己的记忆. TAG: JSON.parse() JSON.stri ...

  9. 面试官：MySQL的幻读是怎么被解决的？

    大家好,我是小林. 我之前写过一篇数据库事务的文章「 事务.事务隔离级别和MVCC」,这篇我说过什么是幻读. 在这里插入图片描述 然后前几天有位读者跟我说,我这个幻读例子不是已经被「可重复读」隔离级别 ...

  10. 使用Java MVC模式设计一个学生管理系统

    最近在做web实验,要求是用jsp+servlet+mysql实现一个学生管理系统,完成对数据库的增删改查. 效果图:   代码: package dao; import java.util.List ...