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

js实现的selece二级联动(简单实用)

阅读更多
以下是html代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<!-- by sundful  starting-->
 <BODY>
  <script   language="JavaScript">     
     
  var   subcat   =   new   Array();     
  subcat[0]   =   new   Array('中文','英语','英语')     
  subcat[1]   =   new   Array('中文','法语','法语')        
  subcat[2]   =   new   Array('英语','中文','中文')     
  subcat[3]   =   new   Array('法语','中文','中文')         
  function   changeselect1(locationid)     
  {     
  document.form1.s2.length   =   0;   //初始化下拉列表   清空下拉数据     
  document.form1.s2.options[0]   =   new   Option('==请选择==','');   //给第一个值     
  for   (i=0;   i<subcat.length;   i++)   //legth=20     
  {     
  if   (subcat[i][0]   ==   locationid)   //[0]   [1]   第一列   第二列     
  {document.form1.s2.options[document.form1.s2.length]   =   new   Option(subcat[i][1],   subcat[i][2]);}   //建立option     
  //第一次   length=1   因为有==请选择==     
  //i=9时   length=   10   值有11个   因为从0数起   subcat[i][0]   ==   locationid屏蔽了再写     
  }     
  }     
  </script>     
    
  <form   name="form1"     method="post"   runat="server">     
  二级联动:     
    
  <select   name="s1"   onChange="changeselect1(this.value)">     
  <option>==请选择==</option>     
  <option   value="中文">中文</option>     
  <option   value="英语">英语</option> 
  <option   value="英语">法语</option> 
  </select>       
    
  <select   name="s2">     
  <option>==请选择==</option>     
  </select>     
  </form> 
<!-- by sundful  ending-->  
 </BODY>
</HTML>
分享到:
评论

相关推荐

    最简单js代码实现select二级联动下拉菜单

    本文实例为大家分享了js实现select二级联动下拉菜单,供大家参考,具体内容如下 &lt;&#37;@ page language="java" import="java.util.*" pageEncoding="UTF-8"%&gt; &lt;&#37; String path = request.getContextPath()...

    js二级联动_精简实用版

    总之,“js二级联动_精简实用版”是一个适用于快速实现省市级联功能的解决方案,它结合了JavaScript的基本概念和实际应用场景,是提升用户体验的一个有效工具。对于想要学习或使用这一功能的开发者来说,这是一个很...

    jquery select二级联动菜单

    本话题主要关注的是使用jQuery实现的二级联动下拉菜单,这是一种常见的交互设计,常用于网站的筛选或导航功能。下面将详细介绍这种二级联动菜单的实现原理、步骤以及相关的jQuery知识。 首先,联动菜单的基本概念是...

    js实现二级菜单联动

    本示例中,我们关注的是“js实现的二级菜单联动”,特别是省市联动的应用。省市联动意味着当用户在一级菜单(省份)中选择一个选项时,二级菜单(城市)会动态更新显示与所选省份相关联的城市列表。这种功能可以极大...

    select二级联动

    在网页开发中,"select二级联动"是一种常见的交互设计,用于实现下拉菜单之间的关联选择。这种技术在处理如地区选择、分类导航等场景时尤为适用。在这个实例中,我们看到一个简单的二级联动示例,它由两个下拉菜单...

    js 省市区select 三级联动(全国城市三级联动下拉列表)

    本文将详细介绍如何使用JavaScript实现全国城市三级联动下拉列表,并结合提供的资源进行解析。 首先,理解“三级联动”的概念:当用户在一级下拉列表(如省份)中选择一个选项时,二级下拉列表(如城市)会根据所选...

    利用JS与HTML实现地级市的简易的二级联动

    在这个案例中,“利用JS与HTML实现地级市的简易的二级联动”就是这样一个功能,它允许用户首先选择省份,然后根据省份选择相应的地级市。 首先,我们需要理解HTML的基础结构。HTML(超文本标记语言)是构建网页内容...

    jsp+js实现的二级联动菜单.pdf

    在IT领域,尤其是在Web开发中,二级联动菜单是一种常见的交互设计,用于呈现具有层次关系的数据。这个案例中,我们讨论的是如何使用JSP(JavaServer Pages)和JavaScript来实现这样的功能,以提高用户体验并减少不必...

    Java中二级联动的简单而实用例子

    Java 中二级联动的简单而实用的例子 Java 中的二级联动是指在 select 选择框中,选择某个选项后,根据选项的值来动态加载另外一个 select 选择框的选项,这种技术广泛应用于许多 web 应用程序中,以提高用户体验和...

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

    总的来说,HTML二级联动下拉列表框的实现涉及HTML、JavaScript以及数据管理,通过监听用户交互,动态更新页面内容,为用户提供更便捷、个性化的操作体验。这种技术在网页表单、地图选择等场景中广泛使用。

    Jquery实现的的动态无刷新的二级联动菜单

    在本示例中,我们探讨的是如何利用jQuery实现一个无刷新的二级联动菜单,这涉及到jQuery库、AJAX异步请求以及JSON数据解析等多个关键知识点。 首先,jQuery是一个轻量级的JavaScript库,它简化了DOM操作、事件处理...

    javascript实现下拉框二级联动

    在网页开发中,二级联动...总结来说,JavaScript实现二级联动下拉框的关键在于监听父级下拉框的改变事件,根据用户选择的数据动态更新子级下拉框的选项。通过合理的数据结构和异步处理,可以实现灵活且高效的联动效果。

    js实现HTML中Select二级联动的实例

    总结起来,这个JavaScript实现的HTML Select二级联动实例主要展示了如何使用JavaScript动态更新下拉列表的内容,以响应用户在另一下拉列表中的选择。通过合理的数据结构和事件监听,可以创建出高效、可维护的联动...

    select三级联动

    通常,三级联动是通过HTML的`&lt;select&gt;`元素和JavaScript(或jQuery)配合实现的。在HTML中,我们创建三个`&lt;select&gt;`标签,分别对应省、市、区,每个`&lt;select&gt;`都有一个`onChange`事件监听器。当用户在一级选择(省)...

    js省市区二级联动和三级联动下拉菜单

    压缩包中的"js省市区三级联动.rar"和"Js省市二级联动.rar"文件可能包含了实现这些功能的示例代码,可以下载后参考学习。通过理解并实践这些代码,你可以更好地掌握JS在构建省市区联动菜单方面的技巧。

    layui下拉框二级数据联动 fzzx.zip

    在提供的`fzzx.zip`压缩包中,包含了一个名为`a.html`的文件,这个文件很可能是用来展示如何实现layui下拉框二级联动的示例代码。打开这个HTML文件,我们可以看到一个包含两个下拉框的页面,第一个下拉框(一级)...

    js城市二级联动

    总的来说,通过jQuery实现城市二级联动是一项实用的前端技能,它利用了DOM操作、事件监听和数据处理等基本概念,同时展示了JavaScript和jQuery结合的强大功能。在开发过程中,我们可以根据实际需求进行适当的修改和...

    省市二级联动代码JS

    标题中的“省市二级联动代码JS”指的是在网页开发中实现的一种交互功能,它允许用户在选择省份后,自动更新下拉菜单以显示对应省份的城市,从而实现两级联动的效果。这种功能通常用于地址输入或者区域筛选等场景,...

    下拉列表二级联动

    以上示例虽然较为简单,但它清晰地展示了二级联动的基本实现思路。在实际项目中,开发者可以根据需求进行更复杂的扩展,如三级或多级联动、异步加载数据、优化UI样式等,以满足更多样化的应用场景。

    asp二级联动下拉框,三级联动下拉框

    在ASP中,二级联动和三级联动下拉框是常见的功能,通常用于实现数据的筛选和过滤,例如在地区选择、商品分类等场景。下面将详细讲解如何在ASP中实现这些功能。 ### 二级联动下拉框 二级联动下拉框是指两个下拉框...

Global site tag (gtag.js) - Google Analytics