`
chengxianju
  • 浏览: 256535 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

js获取select选中的文本和对应的值

FirefoxHTML 
阅读更多

<html>
<head><title>获取下拉列表选中项的值和文本(select)</title></head>
<body>
<script>
//获取下拉列表选中项的文本
function getSelectedText(name){
var obj=document.getElementById(name);
for(i=0;i<obj.length;i++){
if(obj[i].selected==true){
return obj[i].innerText;      //关键是通过option对象的innerText属性获取到选项文本『注』要兼容Firefox需使用innerHTML属性
}
}
}
//获取下拉列表选中项的值
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value;      //如此简单，直接用其对象的value属性便可获取到
}
</script>
<select id="myselect">
<option value="fist">1</option>
<option value="second">2</option>
<option value="third">3</option>
</select>
<input type="button"   value="所选文本"   onclick="alert(getSelectedText('myselect'));" />
<input type="button"   value="所选值" onclick="alert( getSelectedValue('myselect'));" />
</body>
</html>

分享到：
| smarty模板中使用php函数
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    el-select获取选中的label值.pdf

    在Vue.js框架中，Element UI库提供了一个丰富的组件集，其中`el-select`是一个常用的下拉选择组件。在处理用户交互时，有时我们需要获取选中项的`label`或`value`值。从提供的信息来看，这里介绍的是如何在不通过...

    js获取下拉列表中选中的值和文本

    获取`&lt;select&gt;`标签中选中的值和文本是前端开发中常见的需求。 ##### 基本概念 - **`&lt;select&gt;`**: 定义一个下拉列表。 - **`&lt;option&gt;`**: 定义下拉列表中的选项。 ##### 获取选中值 要获取选中的值，可以通过...

    jquery获得select option值

    这里使用了`option:selected`选择器来选取当前被选中的`&lt;option&gt;`元素，并通过`.text()`获取其文本内容。 2. **设置默认选中的下拉项**： ```javascript $('#select_id')[0].selectedIndex = 1; ``` 通过直接...

    html js 清除select里的值,js控制select增删改,选中,清空, 判断控件是否存在

    在HTML和JavaScript编程中，`&lt;select&gt;`元素用于创建下拉列表，经常需要进行动态操作，比如添加、删除、修改选项，以及选中和清空选中的值。本篇文章将探讨如何通过JavaScript来实现这些功能，并判断控件是否存在。...

    js里怎么取select标签里的值并修改

    选项数组中的每个元素都有`.value`和`.text`属性，分别代表选项的值和显示的文本。以下是如何获取选中项的值： ```javascript var selectElement = document.getElementById('company_id'); var selectedValue = ...

    Html获取select元素的真实值和显示值.pdf

    在处理用户交互或数据提交时，我们经常需要获取用户在下拉列表中选择的值以及对应的显示文本。这篇内容主要讨论如何在JavaScript中获取`&lt;select&gt;`元素的真实值（即`&lt;option&gt;`的`value`属性）和显示值（即`&lt;option&gt;`...

    下拉列表选中项的文本值的赋值与取值

    获取下拉列表当前选中项的文本值，可以使用JavaScript的`options`属性和`text`属性。下面是一个示例： ```javascript var selectedOption = document.getElementById('mySelect').selectedIndex; var selectedText ...

    jQuery取得设置清空select选择的文本与值

    在本文中，我们将深入探讨如何使用jQuery来获取、设置和清除`&lt;select&gt;`选择框的文本、值以及选项。 首先，我们来看如何获取`&lt;select&gt;`的选择信息： 1. **获取选中文本**：`$("#ddlregtype").find("option:selected...

    js实现鼠标点击文本框自动选中内容的方法

    标题中提及的"js实现鼠标点击文本框自动选中内容的方法"主要涉及到的是JavaScript编程语言中的两个概念：鼠标点击事件（onClick）和文本选择事件（select）。在Web开发中，页面上的文本框（input type="text"）或者...

    vue.js 获取select中的value实例

    通过这个简单的实例，我们学习到了如何在Vue.js中利用v-model和v-for指令来获取和显示select下拉列表中的选中值。这种方式提供了一个快速方便的方法来实现表单输入与Vue实例数据之间的同步。这样的数据绑定不仅简化...

    JavaScript获取select中text值的方法

    在JavaScript中获取`&lt;select&gt;`元素选中项的文本值可以通过`this.options[this.selectedIndex].text`来实现。这在网页交互中非常常见，比如用于验证用户输入、展示提示信息或者根据用户选择执行相应操作。熟练掌握...

    jquery中获取select选中值的代码

    这样，每当用户改变`&lt;select&gt;`的选择时，控制台会打印出新的选中项的文本、值和索引。这些基本操作是jQuery处理表单数据和用户交互的基础，广泛应用于各种Web应用程序和动态网页中。了解并熟练掌握这些方法对于进行...

    JS 获取select(多选下拉)中所选值的示例代码

    标题中提到的“JS 获取select(多选下拉)中所选值的示例代码”，涉及到的知识点主要集中在JavaScript语言在Web前端开发中如何操作DOM元素，获取和处理用户通过多选下拉框（multiple select element）所选中的值。...

    JavaScript实现获取select下拉框中第一个值的方法

    这个函数封装了获取select下拉框第一个值的操作，点击按钮后，会弹出一个警告框（alert），显示获取到的值和文本。 函数getFirstValOfSelect定义在标签内，这意味着它在页面加载时就已经被定义好，并且可以被任何...

    js控制select相关方法

    这个标签用于创建下拉列表，可以通过JS来实现对下拉列表的选择、添加、删除和更新等操作。以下是对标题和描述中提到的JavaScript控制`select`相关方法的详细说明： 1. **判断 select 选项中 是否存在 Value=...

    js操作select大全 转

    **功能描述**：此行代码用于获取指定`&lt;select&gt;`元素当前选中项的文本。 **参数说明**： - `objSelect`：目标`&lt;select&gt;`元素对象。 通过以上方法，我们可以有效地管理和操作HTML页面中的`&lt;select&gt;`元素及其选项，...

    JS获取select的value和text值的简单实例

    需要注意的是，在实际开发过程中，我们会根据具体需求选择最适合的方法来操作和获取数据。比如，在某些情况下，可能需要使用更为复杂的DOM操作方法，或者结合其他JavaScript框架来处理更为复杂的交互逻辑。 此外，...

    bootstrap select2插件用ajax来获取和显示数据的实例

    每个数据项通常包含一个id和text属性，其中text代表显示给用户的文本，id用于存储与之对应的值。在Select2中，每个数据项可能还包含一个children属性，用来表示有层级关系的选项。这在本实例中通过嵌套的字典来实现...

    select下拉选择不同状态

    3. **JavaScript交互**：为了让选择后的颜色和状态在页面上可见，我们需要使用JavaScript（这里使用jQuery库，因为`jquery-2.0.js`被包含在文件列表中）。当用户改变选择时，更新显示区域的颜色和文本。 ```...

    JS中Select下拉列表类(支持输入模糊查询)功能

    JS中Select下拉列表类支持输入模糊查询功能的知识点主要包括以下几个方面： 1. HTML结构设计：实现输入模糊查询功能的下拉列表通常包含一个输入框和一个下拉框。输入框用于用户输入查询字符，下拉框则是提供选项供...

Magicbox
Global site tag (gtag.js) - Google Analytics