一个下拉框联动的简单例子

最新推荐文章于 2025-07-03 16:16:28 发布
原创 最新推荐文章于 2025-07-03 16:16:28 发布 · 1.1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#class #input #include #html #border #action

此博客展示了一个HTML表单查询页面的代码。包含了表单的基本结构，如输入框、下拉选择框等，还有隐藏输入项。同时有JavaScript函数用于清空输入框和控制元素显示。代码涉及HTML标签、表单操作及简单交互逻辑。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<%@ include file="../bas/headSearch.jsp"%>
<BODY class="classSearchBody"   onkeypress="DoKeyPress();">
<html:form  styleId="frmSearch" action="/ssm/cdSwtInfoList.do?action=list" target="right_frame">
<table border=0 cellspacing=2 cellpadding=2 width="100%">

<tr>
<td class="classSearchTitle">类别名称:<br>
        <html:select name="basMapForm" property="hs(codeType)"  style="width:100%" onchange="clearInput();">
        <option></option>
            <ltcm:listcodetp />
        </html:select>
        </td>
</tr>

<tr id="ctn">
<td class="classSearchTitle">类别名称:<br><html:text name="basMapForm" property="hs(codeTypeName)"  style="width:100%" /></td>
</tr>

<tr>
<td class="classSearchTitle">代码值:<br><html:text name="basMapForm" property="hs(baseCode)"  style="width:100%" /></td>
</tr>

<tr>
<td class="classSearchTitle">代码名称:<br><html:text name="basMapForm" property="hs(baseName)" style="width:100%" /></td>
</tr>
<tr>
<td align=right><button name="btnSearch" onclick="DoSearch();">查询</button></td>
</tr>
</table>


<input type=hidden name="intTotalPages">
<input type=hidden name="intCurrentPage">
</html:form>

<script defer>
function clearInput()
{
    var obj=document.getElementById("hs(codeType)");
    var ctn=document.getElementById("ctn");
    if(obj.options[obj.selectedIndex].innerText!='')
    {
        document.getElementById("hs(codeTypeName)").value="";
        ctn.style.display="none";
    }
    else
    {
        ctn.style.display="";
    }

}

</script>
</BODY>
</HTML>

snoww
关注
Web使用ajax 实现一个下拉框联动另一个下拉框(二)
m0_74456535的博客
11-04 357
Web使用ajax 实现一个下拉框联动另一个下拉框(二)
下拉列表例子
12-19
import java.util.ArrayList; import java.util.ListIterator; public class ArrayListDemo { public static void main(String args[]) { // create an array list ArrayList al = new ArrayList(3); System.out.println("Initial size of al: " + al.size()); // add elements to the array list al.add("C"); al.add("A"); al.add("E"); al.add("B"); al.add("D"); al.add("F"); al.add(1, "A2"); System.out.println("Contents of al: " + al); System.out.println("Size of al after additions: " + al.size()); // display the array list System.out.println("Contents of al: " + al); // Remove elements from the array list al.remove("F"); al.remove(2); System.out.println("Contents of al: " + al); // System.out.println(al.get(2)); // System.out.println(al.indexOf("E")); ListIterator li = al.listIterator(); while(li.hasNext()) { System.out.println(li.next()); } al.clear(); System.out.println(al); } }
联动下拉框
weixin_44579862的博客
08-18 683
联动下拉框是通过第一个下拉框的选择来决定第二个下拉框的值，这就称为联动下拉框，联动下拉框可以是多级联动，由第一个决定第二个，由第二个来决定第三个，这样的层层联动可以构造出多级联动的下拉框，那么既然已经知道了思路，那么制作起来肯定也是非常简单的，具体看以下案例： 首先看下要实现的效果： 实现的效果是，选择第一个出现第二个，选择第二个出现第三个，那么实现代码如下： Css样式： .cont { ...
实现省、市、区三级联动下拉选择功能
最新发布
weixin_32673065的博客
07-03 952
在现代Web应用中，用户经常需要在界面上选择特定的地理位置信息，如省、市和区。为了提升用户体验，通常会采用省市区三级联动下拉框的设计。该设计允许用户通过依次选择上级行政区划来动态加载下一级的选项，从而精确地选择目标区域。为了实现这一功能，开发者需要结合前端技术（如HTML, CSS, JavaScript/jQuery）与后端服务（提供数据接口，如Ajax请求）。此外，数据结构的设计，特别是数据库查询的优化，也是影响联动效果的关键因素。
下拉框联动jquery\js例子
DRD
07-09 414
下拉框联动jquery\js例子 具体代码如下： $(window).load(function () { // 父级下拉框修改时，根据其值修改子级的可见项 $("#parentSelect").change(function () { var parentValue = $(this).val(); var subComponent = $("#subSelect"); b...
实现下拉框联动
c_x211y的博客
05-30 487
&lt;script type="text/javascript"&gt; function factory() { /* 最顶级下拉框 */ var select = document.getElementById("factory"); var c = select.value; /* 中级下拉框 */ var stand = document.getElementByI...
下拉框之间联动
DefetC的博客
08-15 339
&lt;td&gt;单位名称:&lt;/td&gt; &lt;td&gt; &lt;input name="dwid" id="dwid" class="easyui-combobox" data-options="
Angularjs实现下拉框联动的示例代码
10-19
首先，Angularjs中下拉框联动的基本原理是利用`ng-model`将一个下拉框的选中项与另一个下拉框的模型进行绑定，再通过`ng-change`指令配合自定义函数来动态调整第二个下拉框的数据源。 在给定的文件内容中，提到了两...
layui实现下拉框三级联动
10-16
在这个例子中，创建了一个名为`dt_area`的表来存储区域信息。表中有`id`作为主键，`area_name`存储区域名称，`area_code`为区域代码，`area_short`为区域简称，`area_is_hot`表示是否为热门区域，`area_sequence`是...
最简单的下拉框联动不刷新页面示例
01-14
在网页开发中，下拉框联动是一种常见的交互设计，它允许用户在选择一个下拉框选项后，另一个相关的下拉框会自动更新其内容，而无需整个页面进行刷新。这种功能提高了用户体验，减少了不必要的数据传输，加快了页面...
在一个jsp页面实现二级下拉框联动,实时读取数据库数据.pdf
11-23
在JSP（JavaServer Pages）中实现二级下拉框联动，是一种常见的前端与后端交互的场景，常用于动态加载相关数据，例如地区选择、分类筛选等。在这个例子中，我们通过JavaScript、VBScript以及JSP来实现这一功能，确保...
省份城市下拉框联动简单实例实现方法
diqinghuang7695的博客
12-01 555
效果如下 //定义字典 Dictionary<string, string> Address = new Dictionary<string, string>(); void loadData() { //这是你要添加的数据 //也可以选择动态添加但是考虑到数据...
下拉框值触发另一个下拉框
12-12
一个下拉框的值被选中后，触发另一个下拉框状态为可选！ 若值为空则为不可选！
一个联动的下拉框
万豪给给的博客
02-21 429
多个下拉框在一起，后面的下拉框会根据前面选择的内容的变化而变化。 showCity.jsp <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"
联动下拉框的写法
weixin_44549313的博客
07-28 367
这个是我自己写的一个功能。效果图如下： 这个是先让你选择学院，然后它会把学院里面开设的专业给你查询出来，然后选择了学院和专业，就通过学院和专业查询出该学院的某个专业有多少个班。 还要把数据回填到input里。 Css代码： 这里放了一个input，还放了一个’bigbox’的div,这个div是一个空，我是用来制作下拉框的选项的。然后把它定位到input的下面，如上图所示。...
Web使用ajax 实现一个下拉框联动另一个下拉框(一)
m0_74456535的博客
11-03 238
Web使用ajax 实现一个下拉框联动另一个下拉框(一)
Vue 实现二个下拉框的联动
好记性，不如烂键盘。
09-24 1895
Vue 实现二个下拉框的联动。
Vue2_两个下拉框之间联动
Rainbow_bead的博客
01-01 1717
vue_两个下拉框之间进行联动
两个下拉框的联动功能实现
管子（zero）的杂乱空间
11-11 2492
new document 开始时间 13:00 13:30 14:00 14:30 15:00 15:30 16:00 16:30 17:00 17:30 18:00 18:30 19:00 19:30 20:00 20:30 21:30 21:00 22:30 22:00 23:00 结束时间 13:00 13:30 14:00 14:30 15:00 15
HTML下拉框联动功能实现与实例展示
在互联网技术领域中，下拉框联动是一种常见的用户界面交互设计方式，它允许用户在选择一个下拉框中的某个选项后，能够触发另一个下拉框的内容更新，根据第一个下拉框选择的内容显示相关的选项。这种方式可以提高用户...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值