<HTML>
<HEAD>
<script>
function cc(val){
alert(val);
}
</script>
</HEAD>
<BODY>
<form id="formid">
<!-- 下面是得到 option 中的内容 -->
<!--
<select onchange="cc(this[selectedIndex].innerHTML);">
-->
<!-- 下面是得到 option 中value的值 -->
<select onchange="cc(this[selectedIndex].value);" size="2">
<option value="aaa">123</option>
<option value="bbb">456</option>
<option value="ccc">789</option>
<option value="ddd">111</option>
</select>
</form>
</BODY>
</HTML>
补充说明:把拿到的值传到另一个jsp页面。
下面是两个jsp页面:a.jsp和b.jsp。由a.jsp 跳转到b.jsp
a.jsp
<HTML>
<HEAD>
<script>
function cc(val){
// alert(val);
document.getElementById("hiddenid").value=val;
}
</script>
</HEAD>
<BODY>
<form id="formid" action="b.jsp" method="post">
<!-- 下面是得到 option 中的内容 -->
<!--
<select onchange="cc(this[selectedIndex].innerHTML);">
-->
<!-- 下面是得到 option 中value的值 -->
<select onchange="cc(this[selectedIndex].value);" size="1">
<option value="aaa">123</option>
<option value="bbb">456</option>
<option value="ccc">789</option>
<option value="ddd">111</option>
</select>
<input id="hiddenid" type="hidden" name="hiddenid" value="">
<input type="submit" value="提交">
</form>
</BODY>
</HTML>
b.jsp
<HTML>
<HEAD>
</HEAD>
<BODY>
<%
String strname=request.getParameter("hiddenid");
out.print(strname);
%>
</BODY>
</HTML>
分享到:
相关推荐
本文实例讲述了JS实现select选中option触发事件操作。分享给大家供大家参考,具体如下: 我们在用到下拉列表框select时,需要对选中的<option>选项触发事件,其实<option>本身没有触发事件方法,我们只有在select里...
当用户选择一个选项时,`<select>`的`change`事件触发,重新渲染选项以反映新的选择。 CSS样式是使这个功能美观的关键: ```css .custom-select { position: relative; display: inline-block; } .custom-...
Select下拉框的问题,想在选择一个选项后,前台显示做出变动,并且知道选择的是第几个选项。 这个很好解决: 如下: <select class=form-control onchange=selectOnchang(this)> <option>所有申请商家</...
在Vue.js框架中,Element UI库提供了一个丰富的组件集,其中`el-select`是一个常用的下拉选择组件。在处理用户交互时,有时我们需要获取选中项的`label`或`value`值。从提供的信息来看,这里介绍的是如何在不通过...
当用户改变下拉列表中的选中项时,onchange事件被触发,随后执行doSome()函数。这允许我们在用户交互后立即获取选中项的信息。 6. HTML和JavaScript的结合: - 示例展示了一个综合使用HTML和JavaScript(通过...
- 使用`onchange`事件监听器,当用户选择一个`<option>`时,触发`ShowInfo`函数。 - `ShowInfo`函数接收当前选择项的`value`作为参数。 - 函数内部循环遍历所有新闻内容元素,将与所选新闻标题匹配的新闻内容元素...
`option`属性和与之相关的JS事件在不同浏览器之间可能存在差异,这些差异主要体现在事件处理、行为表现和兼容性上。了解并处理这些差异对于确保网页在各种浏览器上的正常运行至关重要。 1. **事件绑定差异** 在...
本文将深入分析`<select>`框触发事件的过程。 首先,我们需要了解一些基本的事件类型: 1. **focus**:当元素获得焦点时触发,例如用户通过鼠标点击或键盘操作使得输入焦点移到了`<select>`元素上。 2. **...
在上面的代码中,`change`事件会在用户改变select1的选中状态时触发。`find('option:selected')`查找所有被选中的选项,然后通过循环将这些选项的值和文本添加到select2中。如果需要,我们还可以移除select1中的已...
综上所述,"js select选中显示不同表单内容.zip"项目展示了如何结合HTML5的`<select>`元素、CSS的样式控制和JavaScript/jQuery的事件处理来实现动态的前端交互。通过监听用户的选择,实时更新页面上的表单内容,提供...
- `onChange`事件:当用户更改了选中的选项时触发。可以这样添加事件监听器: ```javascript selectElement.addEventListener('change', function() { console.log('当前选中的值:', this.value); }); ``` 5. ...
// 可以在这里添加触发其他业务逻辑,如存储选中的值 } }); ``` ### 3. 扩展功能 模拟下拉菜单可以实现更多高级功能: - **搜索过滤**:添加搜索框,实时过滤下拉菜单中的选项。 - **分组**:通过子元素或CSS伪...
为每个`select`元素添加`change`事件监听器,当用户更改选项时触发相应函数。 3. 逻辑处理:在`change`事件的回调函数中,获取当前选中的值,并根据预设的联动规则更新其他`select`元素的选项。这可能涉及清除某些...
现在,你可以通过`$('select').selectOption('value', false)`或`$('select').selectOption('text', true)`来根据值或文本选中选项。 此外,我们可以考虑在插件中添加事件监听,以便在用户更改选择时触发某些操作。...
根据给定的信息,本文将详细解释“select选择事件”中的相关知识点,包括如何利用JavaScript处理select元素的选择事件、鼠标移动事件以及如何获取select元素的选中值。 ### 一、理解select元素及其事件 #### 1.1 ...
在网页开发中,JavaScript(简称JS)是一种必不可少的前端编程语言,它被广泛用于实现页面交互和动态效果。本文将详细讲解如何使用JavaScript来模拟点击一个`<select>`元素,从而展示其下拉菜单列表。`<select>`是...
当用户在`select`元素中选中一个不同的选项时,浏览器会自动触发`onchange`事件,并执行绑定到该事件上的JavaScript函数。比如下面的例子: ```html 省份: <select id="province" onchange="changeProvince()"> ...
在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和Ajax交互等任务。本文将深入探讨如何使用jQuery实现两个`<select>`元素之间的`<option>`选项转移操作,包括全选、单选以及...