`
tanglong8848
  • 浏览: 72784 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

下拉列表onchange事件

 
阅读更多

<html>
<title>testpage</title>
<head>
<style>
//style="overflow-y:hidden;overflow-x:hidden";
</style>
<script language="javascript" type="text/javascript">
function chg(){
//var id=document.getElementById("showpage").value
if(document.form1.slt.value=="11111"){
document.getElementById("showpage").style.display="";
document.getElementById("showit").style.display="";
}
if(document.form1.slt.value=="22222"){
document.getElementById("showpage").style.display="none";
document.getElementById("showit").style.display="none";
}

if(document.form1.slt.value=="33333"){
document.getElementById("showpage").style.display="";
}
if(document.form1.slt.value=="55555"){
document.getElementById("showit").style.display="none";
}


}
</script>
</head>
<body>
<form action="#" name="form1" method="post">
<select name="slt" onchange="chg()">
<option>please select</option>
<option value="11111">11111</option>
<option value="22222">22222</option>
<option value="33333">33333</option>
<option value="44444">44444</option>
<option value="55555">55555</option>
</select>
<br />
<input name="showpage" type="text" value="this is a test page" style="display:none;border-left:0px;border-top:0px;border-right:0px;border-bottom:1px solid #ff0000 " />
<div id="showit">good for you</div>
</form>
</body>
</html>

分享到:
评论

相关推荐

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

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

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

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

    下拉列表二级联动

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

    下拉列表按键自动选择

    在这个例子中,我们为下拉列表添加了一个'input'事件监听器,当用户在输入框中输入字符时,函数会遍历所有选项,如果选项的文本以输入值开头,就将该选项设置为选中。 此外,现代前端框架如React、Vue或Angular也有...

    servlet+ajax做的两个下拉列表联动

    第一个下拉列表的`onchange`事件触发Ajax请求。 2. **JavaScript**:编写Ajax请求的代码,使用XMLHttpRequest或fetch API。在请求中携带第一个下拉列表的选中值,以便服务器根据该值查询相关数据。 3. **Servlet**...

    jquery简单实现级联下拉列表

    3. **HTML结构**:`#s1` 和 `#s2` 分别代表了两个下拉列表,其中 `#s1` 的 `onchange` 属性绑定了 `change()` 函数,使得每次选中值变化时都能触发级联更新。 ### 实现细节 1. **动态生成HTML元素**:通过 `$('...

    下拉列表框的联动事件

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

    jsp中select的onchange事件用法实例.docx

    在Web开发中,`onchange`事件是一种常用的JavaScript事件,用于在用户更改表单元素(如`&lt;select&gt;`下拉列表)时触发特定的操作。在JSP(JavaServer Pages)环境中,结合Java后端技术,我们可以实现更复杂的功能,例如...

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

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

    Ajax实现下拉列表从数据库读取数据级联

    1. **前端交互**:使用JavaScript(通常配合jQuery库)监听一级下拉列表的`onchange`事件,当用户选择一个选项时触发Ajax请求。 2. **Ajax请求**:构造适当的URL,包含当前选中的父级选项ID,然后发送Ajax请求到...

    数据库三级联动下拉列表

    4. **事件监听**:在JavaScript中,为上一级下拉列表添加`onChange`事件监听器,当用户更改选择时,触发服务器端的更新动作,重新执行上述步骤,更新下一级的下拉列表。 5. **处理异步请求**:考虑到用户体验,可以...

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

    可以使用“OnChange”事件,当用户在文本框中输入时触发,通过JavaScript表达式或 Axure 的内置函数过滤动态面板的内容。 总的来说,了解如何在Axure RP 8中创建和使用带有高级特性的UI组件,如带滚动条和筛选的...

    ajax 下拉列表框

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

    ajax实现下拉列表级联

    3. **Ajax请求**:在前端,当主下拉列表的onChange事件触发时,使用JavaScript(可能结合jQuery库)构造一个Ajax请求,将选定的主选项值发送到服务器。 4. **处理请求**:服务器端的EJB方法接收到请求后,根据传递...

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

    2. 编写JavaScript代码:使用JavaScript创建XMLHttpRequest对象,监听第一个下拉列表的`onchange`事件。当用户改变选择时,触发AJAX请求。 3. 发起AJAX请求:在事件处理器中,构造合适的HTTP请求,包括URL、HTTP...

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

    在ASP.NET中,可以通过JavaScript或jQuery监听第一个下拉列表的onChange事件,然后动态改变第二个下拉列表的选项。 实现这样的功能,开发者需要具备以下几点技术: 1. 熟悉ASP.NET控件,如DropDownList,以及如何...

    js+jsp 联动下拉列表框

    2. **事件监听**:当用户在主分类下拉列表中选择不同的选项时,会触发`onChange`事件,进而调用`changelocation()`函数。 3. **数据更新**:`changelocation()`函数根据所选父类ID更新子分类下拉列表的内容。首先清...

    jsp中select的onchange事件用法实例

    本文还提供了另一个综合示例,说明了如何在表单中集成了多个select元素,并通过onchange事件来关联不同的下拉列表。例如,省份选择后,根据所选省份变化城市选择列表。 ```html &lt;select name=province onChange=...

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

    3. **JavaScript/jQuery交互**:在前端,使用JavaScript或者jQuery监听第一个下拉列表的`onchange`事件。当用户选择一个省份时,触发一个AJAX请求,将所选省份ID发送到服务器。 4. **服务器端处理**:JSP接收AJAX...

    可输入的DropDownList 下拉列表 Asp

    3. **事件处理**:监听用户的选择和输入事件,如onChange、onClick等。 4. **数据验证**:确保用户输入的有效性和安全性,防止非法字符或空值。 5. **服务器端处理**:在ASP中接收并处理来自客户端的请求,例如更新...

Global site tag (gtag.js) - Google Analytics