`
哈达f
  • 浏览: 120306 次
  • 性别: Icon_minigender_1
  • 来自: 广西
社区版块
存档分类
最新评论

下拉列表框onchange事件

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>

<style type="text/css">
#cssid{
	height:100px;
	width:300px;
	background-color:#FFCC00;
	}
#textid{
	background-color:#CCCCCC;
	width:300px;
	}
</style>
<script type="text/javascript" src="../Day26/doctool.js"></script>
<script type="text/javascript">
function change()
{
	var selNode = byId("selid");
	
	var value = selNode.options[selNode.selectedIndex].value;
	
	//alert(value);
	var divNode1 = byId("cssid");
	var divNode2 = byId("textid");
	
	divNode1.style.textTransform = value;
	divNode2.innerText = "text-transform : "+value+";";
}
</script>
</head>

<body>

<div id="cssid">
	Good good study,Day day up!
</div>
<p>
</p>
<select id="selid" onchange="change()">
	<option value="none">--text-transform--</option>
    <option value="capitalize">首字母大写</option>
    <option value="uppercase">所有字母大写</option>
    <option value="lowercase">所有字母小写</option>
</select>
<p></p>
<div id="textid">
	text-transform : none;
</div>
</body>
</html>

 

分享到:
评论

相关推荐

    Axure RP 8 带滚动条带筛选的下拉列表框 圆角文本框

    在UI设计中,下拉列表框是一种常用的输入控件,它允许用户从预定义的一组选项中进行选择,通常用于节省屏幕空间和提供更整洁的界面。当选项过多时,会显示滚动条以便用户浏览所有选项。 "带滚动条"的下拉列表框意味...

    网页表单级联下拉列表自动填写方法

    使用JavaScript的onchange事件可以监听页面的变化,当用户选择了前一个下拉列表框的选项后,JavaScript就会根据用户的选择来动态生成后一个下拉列表框的选项。 例如:...

    ajax 下拉列表框

    **Ajax 下拉列表框详解** Ajax(Asynchronous JavaScript and XML)技术是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。在Web开发中,它极大地提升了用户体验,使得页面交互更加流畅。本教程将...

    无限级、无刷新、联动下拉列表框

    在IT领域,尤其是在Web开发中,"无限级、无刷新、联动下拉列表框"是一种高效且用户体验良好的设计模式。这种技术通常应用于大型数据结构,如层级数据或分类系统,例如组织架构、地区层级或者产品分类等。在ASP.NET...

    网页表单自动填写——下拉列表框、单选框、复选框自动填写方法

    ### 网页表单自动填写技术详解:下拉列表框、单选框、复选框自动填写方法 #### 一、网页下拉列表的自动填写实现方法 在现代Web应用开发中,为了提高用户体验及简化操作流程,网页表单自动填写功能逐渐成为一种重要...

    HTML二级联动下拉列表框的实现,如选择 省,市.zip

    HTML二级联动下拉列表框是一种常见的网页交互设计,它允许用户在两个或多个下拉菜单之间建立关联,以便根据用户在第一个下拉框中的选择动态更新第二个下拉框的内容。这种设计常见于区域选择,例如选择省份后,城市...

    下拉列表框的联动事件

    ### 下拉列表框的联动事件 在Web开发中,下拉列表框的联动是一种常见的交互方式,主要用于根据用户在一个下拉列表中的选择动态地改变另一个下拉列表的内容。这种技术广泛应用于各种场景,如根据省份选择城市、根据...

    多選下拉列表框

    在IT领域,多选下拉列表框是一种常见的用户界面组件,它允许用户在下拉菜单中选择一个或多个选项。这种交互方式广泛应用于各种应用程序,如网页表单、桌面软件和移动应用,以提高用户体验并优化屏幕空间。下面将详细...

    动态实现下拉列表框三级级联查询

    在IT领域,动态实现下拉列表框的三级级联查询是一项常见的前端交互功能,它能够为用户提供更加便捷的导航和筛选体验。在这个场景中,我们使用JSP(JavaServer Pages)脚本语言来实现这一功能。JSP是Java平台上的...

    js+jsp 联动下拉列表框

    ### js+jsp 联动下拉列表框 在网页开发中,经常需要用到联动下拉列表来实现数据的动态关联展示。例如,在一个电子商务网站上,用户选择省份时,对应的市级下拉列表会随之更新。这种功能的实现依赖于前端JavaScript...

    AJAX实现的动态下拉列表框例子

    在网页设计中,动态下拉列表框是一种常见且实用的功能,它能提升用户体验,使得用户在选择时无需刷新页面即可获取更多选项。本示例主要介绍如何使用AJAX(Asynchronous JavaScript and XML)技术来实现这样的功能。...

    下拉列表二级联动

    二级联动的核心在于监听第一个下拉列表的`onChange`事件,当用户在第一个下拉列表中选择一个选项时,触发该事件,通过JavaScript获取当前选中的索引或值,然后根据这个信息动态地更新第二个下拉列表的选项。...

    jsp+ajax+mysql实现的三个下拉列表框级联

    同样,当第二个下拉列表框的`onchange`事件触发时,重复上述过程,但这次更新的是第三个下拉列表框。 6. **数据库设计**:数据库表结构需设计成支持级联查询,例如,可以有三个表,分别对应省份、城市和区县,每个...

    自动显示下拉列表框

    在IT行业中,自动显示下拉列表框是一种常见的交互设计,特别是在网页和桌面应用程序中,它极大地提升了用户体验。这里我们将深入探讨如何使用`ComboBox`控件实现这种功能,以实现类似百度搜索框的效果。 首先,`...

    easyui-textbox和easyui-combobox的onchange事件响应实例

    `easyui-combobox` 则是一个下拉选择框组件,允许用户从预定义的选项列表中选择一项。这两个组件在网页表单中非常常见,可以用于收集用户的输入数据。 `onchange` 事件是 JavaScript 中的一个重要事件,它会在元素...

    DWR+hibernate+spring级联下拉列表框

    6. **事件处理**:在 JavaScript 中,监听第一个下拉列表框的 `onchange` 事件,当选择的部门发生变化时,调用 DWR 接口获取新的员工列表,并更新第二个下拉列表框。 7. **安全与优化**:确保 DWR 接口的安全性,...

    javascript 操作select下拉列表框的一点小经验.docx

    1. **事件处理**:通过设置`onchange`事件监听器,当用户改变下拉列表框的选择时,会自动触发相应的JavaScript函数。 2. **动态更新**:使用Ajax控件`atlas:UpdatePanel`来实现页面部分刷新,从而提升用户体验。 3. ...

    ACCESS 双表自动查询数据(下拉列表框)

    通过下拉列表框,用户可以方便地从预设选项中选择,系统则会根据选择自动执行查询,显示相关联的第二张表格的数据。这种设计通常用于多级筛选或关联查询的场景。下面将详细讲解如何实现这一功能。 首先,我们需要...

    jsp出生日期三级级联下拉列表

    2. **JavaScript事件**:在级联下拉列表中,我们需要监听用户的每次选择,这通常通过`onchange`事件来实现。当用户更改了一个下拉列表的选项时,触发关联的JavaScript函数。 3. **DOM操作**:JavaScript可以用来...

    在DBGRID控件的单元格中实现下拉列表框(3KB)...

    总的来说,实现DBGrid单元格内的下拉列表框需要对VB6的事件驱动编程和控件交互有深入理解。通过自定义控件和精确的数据绑定,我们可以为用户提供更友好的交互体验,同时保持数据的完整性和一致性。这个过程涉及到的...

Global site tag (gtag.js) - Google Analytics