jsp中select的onchange事件用法实例

本文实例讲述了jsp中select的onchange事件用法。分享给大家供大家参考,具体如下:

<script language = "JavaScript">
 var onecount;
 onecount=0;
 subcat = new Array();
 <%
 int count = 0;
 java.sql.ResultSet rs1 = DBManage.executeQuery("select hydm,zhydm,zhymc from zhy ");//读取数据
 while(rs1.next())
 {
 String selhydm=rs1.getString("hydm").trim();
 String zhydm=rs1.getString("zhydm").trim();
 String zhymc=rs1.getString("zhymc").trim();
 %>
 subcat[<%=count%>] = new Array("<%=zhydm%>","<%=selhydm%>","<%=zhymc%>");//产生数组
 <%
 count = count + 1;
 }
 if(rs1!=null) DBManage.closeCOnn();
 %>
 onecount=<%=count%>;
 function changelocation(id)
 {
 document.form1.selzhy.length = 0;
 var hydm=id;
 var i;
 document.form1.selzhy.options[0] = new Option('选择子行业分类','');
 for (i=0;i < onecount; i++)
 {
 if (subcat[i][1] == hydm)
 {
 document.form1.selzhy.options[document.form1.selzhy.length] = new Option(subcat[i][2], subcat[i][0]);
 }
 }
 }
</script>
<table width="500" border="0" cellspacing="0" cellpadding="0" align="center">
 <tr>
 <td width="180" height="20" align="right">选择行业分类:</td>
 <td width="320">
 <select name="selhy" onChange="changelocation(document.form1.selhy.options[document.form1.selhy.selectedIndex].value)" size="1" >
 <option value="2">请选择行业分类</option>
 <%
 rs = DBManage.executeQuery("select * from hy");
 while(rs.next())
 {
  String hydm=rs.getString("hydm").trim();
  String hymc=rs.getString("hymc").trim();
 %>
 <option value="<%=hydm%>"><%=hymc%></option>
 <%
 }
 if(rs!=null) DBManage.closeCOnn();
 %>
 </select>
 </td>
 </tr>
 <tr>
 <td height="20" align="right">选择子行业分类:</td>
 <td>
 <select name="selzhy" >
 <option value="" selected>请选择子行业分类</option>
 </select>
 </td>
 </tr>
</table>

<form name=form1>
 <select name=province onchange="cityName(this.selectedIndex)">
  <option value="">请选择省名</option>
 </select>
 <select name=city>
  <option value="">请选择城名</option>
 </select>
 </form> 

 <script language=javascript>
 var city1 = ["杭州", "宁波", "温州", "绍兴", "金华", "湖州"];
 var city2 = ["南京", "苏州", "无锡", "常州", "镇江", "徐州"];
 var city3 = ["合肥", "翕县", "黄山", "祁门", "休宁"];
 var city4 = ["南昌", "九江", "赣州", "上饶", "新余", "景德镇"];
 var provinceName = ["浙江", "江苏", "安徽", "江西"];
 function province()
 {
   var e = document.form1.province;
   for (var i=0; i<provinceName.length; i++)
    e.options.add(new Option(provinceName[i], provinceName[i]));
 }
 function cityName(n)
 {
   var e = document.form1.city;
   for (var i=e.options.length; i>0; i--)  e.remove(i);
   if (n == 0) return;
   var a = eval("city"+ n); //得到城市的数组名
   for (var i=0; i<a.length; i++) e.options.add(new Option(a[i], a[i]));
 }
 function window.onload()
 {
   province(); //初始时给省名下拉菜单赋内容
 }
 </script>

希望本文所述对大家JSP程序设计有所帮助。

(0)

相关推荐

  • Js操作Select大全(取值、设置选中等等)

    jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selector"></select> 1.设置value为pxx的项选中 $(".selector").val("pxx"); 2.设置text为pxx的项选中 $(".selector").find("option[tex

  • 封装html的select标签的js操作实例

    复制代码 代码如下: function BindSelect(id,dataList,fieldtext,fieldValue) { //绑定某一个数据源,fieldtext为需要绑定的文本字段,fieldValue为需要绑定的value字段 var select = $("#" + id)[0]; for (var i = 0; i < dataList.length; i++) { select.options.add(new Option(eval("dataLi

  • jquery及原生js获取select下拉框选中的值示例

    现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 复制代码 代码如下: <select id="test" name=""> <option value="1">text1</option> <option value="2">text2</option> </select> 一:javas

  • jQuery结合CSS制作漂亮的select下拉菜单

    我们在进行表单设计时,可能要用到select下拉选项控件,遗憾的是,IE浏览器默认的select控件外观非常丑陋,而且不能用样式来控制,不能在选项中添加图片等信息.今天我将通过实例来讲解如何用CSS和jQuery来制作漂亮的下拉选项菜单. XHTML <div id="dropdown"> <p>请选择城市</p> <ul> <li><a href="#">长沙</a></li

  • JSP页面中如何用select标签实现级联

    做查询页面,查询条件比较多的时候往往会涉及到级联.举个简单的例子,拿教务系统来说,我们要查询教学计划信息,查询条件是入学批次.学生层次(专升本.高升专).专业.课程. 它们之间有什么级联关系呢?入学批次影响学生层次(某个入学批次可能只有专升本或者高升专一个学生层次).专业.课程,学生层次影响专业.课程,专业又影响课程.也就是说当选择入学批次时,学生层次.专业和课程的下拉框会局部刷新,选择学生层次时,专业和课程的下拉框会局部刷新,选择专业时,课程的下拉框也会局部刷新. 我们当然不希望已经选择的操作

  • jQuery动态添加删除select项(实现代码)

    复制代码 代码如下: // 添加function col_add() { var selObj = $("#mySelect"); var value="value"; var text="text"; selObj.append("<option value='"+value+"'>"+text+"</option>");}// 删除function col_d

  • JQuery中对Select的option项的添加、删除、取值

    jQuery获取Select选择的Text和Value: 复制代码 代码如下: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text var checkValue=$("#select_id

  • JS、jQuery中select的用法详解

    1.js var obj=document.getElementById(selectid); obj.options.length = 0; //清除所有内容 obj.options[index] = new Option("three",3); //更改对应的值 obj.options[index].selected = true; //保持选中状态 obj.add(new Option("4","4")); "文本",&

  • javascript中select下拉框的用法总结

    本文针对开发项目中遇到的问题,进行了汇总 问题1:如何选择select的option里面的值? 首先会用到一个方法 onchange():这个方法主要用于触发,选择框内容改变时间 实现代码: <!doctype html> <html> <head lang="en"> <meta charset="UTF-8"> </head> <body> <select onchange="

  • js获取select选中的option的text示例代码

    javascript 复制代码 代码如下: var item = document.getElementById(""); var text = item.options[item.selectedIndex].text; jQuery 复制代码 代码如下: var text = $("#selector")[0].options[$("#selector")[0].selectedIndex].text

  • js select option对象小结

    一基础理解: var e = document.getElementById("selectId"); e. options= new Option("文本","值") ; //创建一个option对象,即在<select>标签中创建一个或多个<option value="值">文本</option> //options是个数组,里面可以存放多个<option value="

  • 浅析jQuery对select操作小结(遍历option,操作option)

    //遍历option和添加.移除optionfunction changeShipMethod(shipping){ var len = $("select[@name=ISHIPTYPE] option").length if(shipping.value != "CA"){  $("select[@name=ISHIPTYPE] option").each(function(){   if($(this).val() == 111){   

  • jquery模拟SELECT下拉框取值效果

    jquery模拟SELECT框,效果图如下:   复制代码 代码如下: <!DOCTYPE html> <html lang="en"> <head> <title>jquery模拟SELECT框</title> <meta charset="utf-8"> <style> body{padding:0;margin:0;font-size:12px;} ul,li{list-sty

  • 删除select中所有option选项jquery代码

    这样写 复制代码 代码如下: <select id="search"> <option>baidu</option> <option>sogou</option> </select> 清空: 复制代码 代码如下: $("#search").find("option").remove(); 或者 $("#search").empty();

  • js简单实现HTML标签Select联动带跳转

    复制代码 代码如下: <script src="Scripts/jquery-1.9.1.min.js" type="text/javascript"></script> 复制代码 代码如下: <FORM name="form5" id="form5" action="" method="post" target="_blank" ons

  • Jquery多选下拉列表插件jquery multiselect功能介绍及使用

    有一个多选的需求,在网上找到了这个插件:multiselect https://github.com/ehynds/jquery-ui-multiselect-widget csdn博客上有这个插件的介绍,不少童鞋都问了这么个问题,怎么获取选中的值?真是个好问题,因为我在看demo的时候也发现了这个问题,呵呵! 先简单说说这个插件: jquery-multiselect 基于Jquery-ui的组件体系. 所以使用它的时候,先得导入jquery-ui相关的js和css哦 特性 •支持点击labe

随机推荐