<script type="text/javascript">
var message = "${message}";
if(message.length>0){
alert(message);
}
function showDiv(){
var type="${linkType}";
var selectValue = document.getElementById("selectName");
var div = document.getElementById("back1");
var div1 = document.getElementById("back2");
var div2 = document.getElementById("back3");
if(type!=null){
if(type=="1"){
div.style.display = "block";
selectValue.options[0].text = "aa";
div2.style.display = "none";
div1.style.display = "none";
}
if(type=="2"){
var optionValue = document.getElementById("option2");
// selectValue.text = "教育部专业网站";
// optionValue.text = "教育部专业网站";
//改变select下来源显示的值,但这样做老是不成功,希望有人帮我,当我传的option中的value值不一样时,select显示的value也跟着变化
selectValue.options[1].text = "bb";
div.style.display = "none";
div2.style.display = "none";
div1.style.display = "block";
}
if(type=="3"){
div.style.display = "none";
div1.style.display = "none";
div2.style.display = "block";
selectValue.options[2].text = "cc";
}
}
}
function showFriendLink(num){
var div = document.getElementById("back1");
var div1 = document.getElementById("back2");
var div2 = document.getElementById("back3");
if(num=="1"){
div.style.display = "block";
div2.style.display = "none";
div1.style.display = "none";
}
if(num=="2"){
div.style.display = "none";
div2.style.display = "none";
div1.style.display = "block";
}
if(num=="3"){
div.style.display = "none";
div1.style.display = "none";
div2.style.display = "block";
}
}
</script>
<select id="selectName" name="selectName" onchange="showFriendLink(this.options[this.selectedIndex].value)">
<option id="option1" value="1">aa</option>
<option id="option2" value="2">bb</option>
<option id="option3" value="3">cc</option>
</select>
分享到:
相关推荐
在JavaScript中,获取下拉列表(也称为选择框或`<select>`元素)的值是一项常见的任务,特别是在处理用户输入和交互时。本篇博文中,我们将深入探讨如何有效地实现这一功能。 首先,我们需要理解HTML中的`<select>`...
在网页设计中,"DIV+CSS+JS仿Select下拉表单"是一种常见的技术,用于创建自定义且具有更丰富交互性的下拉选择组件。这种技术通常用来替代原生HTML中的`<select>`元素,因为它提供了更多的设计自由度和用户体验优化的...
JavaScript实现下拉列表选中某个值的方法主要包括三种方式,分别为通过索引选择、通过name或id选择以及通过value值选择。以下详细阐述每种方法的实现原理和步骤。 首先,了解基本的HTML结构,一个下拉列表通常由一...
例如,我们可以监听`select2:select`事件来响应用户的选择变化。 ```javascript $('select').on('select2:select', function (e) { var data = e.params.data; console.log('选定的值:', data.id, ', 文本:', ...
3. **FixedMenu.js**:JavaScript文件,负责处理仿Select下拉表单的动态行为,如打开和关闭下拉列表,处理用户选择,以及可能的动画效果。 4. **CJL.0.1.min.js**:这可能是一个压缩过的JavaScript库,提供了一些...
接下来,我们将使用jQuery来监听radio按钮的变化,并根据选中的值改变相应的select下拉列表。以下是一个基本的实现示例: ```javascript $(document).ready(function() { // 首先,我们需要在页面加载时初始化下拉...
实现Selectbox的关键在于用JavaScript动态创建和管理选项。首先,我们需要将原始的复选框替换为隐藏的`<select>`元素,然后为每个原始复选框创建对应的`<option>`。接着,使用JavaScript监听`<select>`元素的`change...
引入CSS和JS文件后,记得在页面中添加jQuery库,因为`Select2`是基于jQuery的。 2. **HTML结构** 创建一个基础的HTML结构,包括三个`<select>`元素,分别代表省份、城市和区县。每个`select`元素都有对应的ID,...
"手动样式仿select下拉列表框"就是一个这样的实践,它通过CSS和JavaScript等技术,使得原本样式单一的SELECT元素变得更为美观、交互性强。 在传统的HTML中,SELECT元素用于创建下拉列表,但其默认样式受到浏览器的...
在本项目中,“美漂亮的实用div+css模仿select下拉控件”是一个使用JavaScript(jq,即jQuery库)实现的,旨在提供一种更美观、用户体验更好的下拉选择功能。接下来,我们将详细探讨这个项目中的关键知识点。 1. **...
《jQuery插件 stylish-select:构建完全自定义的select下拉列表》 在Web开发中,Select元素是不可或缺的一部分,但其默认样式往往无法满足设计师和开发者对于界面美观度的需求。这时,jQuery插件stlish-select...
在JavaScript(JS)中,下拉按钮列表控件是一种常见的用户界面元素,它允许用户从一组预定义的选项中选择一个。这种控件通常用于节省屏幕空间,特别是在移动设备上,因为它们可以将大量信息封装在一个小的交互区域。...
#### 标题:js 动态新增改变删除select的值 在网页开发中,`<select>`元素是非常常见的表单元素之一,用于提供下拉列表供用户选择。JavaScript 提供了丰富的 API 来操作 `<select>` 元素及其选项。本文将详细讲解...
要实现选中值的互换,我们需要借助jQuery的`val()`方法来获取或设置选中项的值,以及`change`事件来监听用户的选择变化。以下是一个简单的互换逻辑实现: ```javascript $(document).ready(function() { // 监听...
本示例中,"JQ JS javascript layui UI框架 带搜索下拉框 select" 是一个基于jQuery和layui的特定功能实现,即在layui的UI设计中创建了一个具有搜索功能的下拉选择框。这个功能在许多网页应用中都很常见,例如在表单...
在创建联动下拉菜单时,我们会用到`<select>`和`<option>`标签来定义下拉列表。例如: ```html <select id="parentSelect"> <option value="option1">Option 1 <option value="option2">Option 2 </select> ...
"select下拉检索插件修改版.zip" 提供的正是这样一种解决方案,它是一个针对HTML `<select>` 元素的增强插件,旨在改善原始下拉框的搜索功能。这个压缩包包含了两个核心文件:searchableSelect.css 和 jquery....
下面将详细介绍 Bootstrap Select 的使用方法、核心功能以及与 JavaScript(js)和 CSS 的关联。 1. **安装与引入** 要使用 Bootstrap Select,首先确保你已经在项目中引入了 Bootstrap 的 CSS 和 JS 文件,以及 ...
综上所述,通过引入select2.css和select2.js,结合适当的JavaScript代码,我们可以实现Select2插件的联动查询功能。在实际项目中,确保这两个文件被正确引用,并根据项目需求进行适当的配置和定制。
《原生JavaScript实现的下拉多选控件CheckboxSelect_v2.8.8详解》 在Web开发中,下拉多选控件是常见的交互元素,它能够为用户提供方便的选择多个选项的功能。CheckboxSelect_v2.8.8是一款基于原生JavaScript编写的...