前台:

<form id="form1" runat="server">
<div>

<select id="Province">
<option>请选择</option>
</select>

<select id="City">
<option>请选择</option>
</select>
地区
<select id="Space">
<option>请选择</option>
</select>
<script type="text/javascript">
$(function () {
$.ajax({
url: "TestClass/Cascade.ashx?id=1",
async: false,
success: function (data) {
$("#Province").append(data);
$("#Province").change(function () {
$.ajax({
url: "TestClass/Cascade.ashx?id=2",
data: { pid: $("#Province").attr("value") },
success: function (data) {
$("#City").html("");
$("#City").append(data);
$("#City").change(
function () {
$.ajax({
url: "TestClass/Cascade.ashx?id=3",
data: { cid: $("#City").attr("value") },
success: function (data) {
$("#Space").html("");
$("#Space").append(data);
}
})
})
}
})
})
}
})
})
</script>
</div>
</form>

后台:

  public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
if (context.Request.QueryString["id"] == "")
{
string sql = "SELECT ID,[enname] FROM [ProvinceInfo] WHERE ParentId=0";
StringBuilder sb = new StringBuilder();
SqlDataReader reader = PubSqlHelperFunc.ExecuteSqlDataReader(CommandType.Text, sql, null);
while (reader.Read())
{
sb.Append("<option value=");
sb.Append(reader["Id"]);
sb.Append(">");
sb.Append(reader["enname"]);
sb.Append("</option>");
}
reader.Close();
context.Response.Write(sb.ToString());
}
else if (context.Request.QueryString["id"] == "")
{
string sql = "SELECT ID,[enname] FROM [ProvinceInfo] WHERE ParentId=" + context.Request.Params["pid"] + "";
StringBuilder sb = new StringBuilder();
sb.Append("<option>请选择</option>");
SqlDataReader reader = PubSqlHelperFunc.ExecuteSqlDataReader(CommandType.Text, sql, null);
while (reader.Read())
{
sb.Append("<option value=");
sb.Append(reader["Id"]);
sb.Append(">");
sb.Append(reader["enname"]);
sb.Append("</option>");
}
reader.Close();
context.Response.Write(sb.ToString());
}
else if (context.Request.QueryString["id"] == "")
{
string sql = "SELECT ID,[enname] FROM [ProvinceInfo] WHERE ParentId=" + context.Request.Params["cid"] + "";
StringBuilder sb = new StringBuilder();
sb.Append("<option>请选择</option>");
SqlDataReader reader = PubSqlHelperFunc.ExecuteSqlDataReader(CommandType.Text, sql, null);
while (reader.Read())
{
sb.Append("<option value=");
sb.Append(reader["Id"]);
sb.Append(">");
sb.Append(reader["enname"]);
sb.Append("</option>");
}
reader.Close();
context.Response.Write(sb.ToString());
}
}

JS制作的简单的三级及联的更多相关文章

  1. three.js 制作一个简单的圆柱体模型

    <!DOCTYPE html> <html lang="en"> <head> <title>three.js webgl - or ...

  2. 用JS做一个简单的电商产品放大镜功能

    使用js制作一个简单的产品放大图 购物网站的产品页经常会放有一个产品展示图区.该图区有一个功能就是产品图的放大功能,移动左侧的焦点区域,可以放大细节部分观看,详情如下图.实现该功能的方法也非常简单. ...

  3. 基于node.js制作爬虫教程

    前言:最近想学习node.js,突然在网上看到基于node的爬虫制作教程,所以简单学习了一下,把这篇文章分享给同样初学node.js的朋友. 目标:爬取 http://tweixin.yueyishu ...

  4. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  5. css制作最简单导航栏

    css制作最简单导航栏

  6. 用JS制作一个信息管理平台完整版

      前  言 JRedu 在之前的文章中,介绍了如何用JS制作一个实用的信息管理平台. 但是那样的平台功能过于简陋了,我们今天来继续完善一下. 首先我们回顾一下之前的内容.   1.JSON的基础知识 ...

  7. 利用css+原生js制作简易钟表

    利用css+原生js制作简单的钟表.效果如下所示 实现该效果,分三大块:html.javascript.css html部分html部分比较简单,定义一个clock的div,内部有原点.时分秒针.日期 ...

  8. JS制作图片切换

    <!DOCTYPE html> <html> <head> <title>纯JS制作简单的图片切换</title> <meta cha ...

  9. HTML+纯JS制作音乐播放器

    该篇文章会教你通过JavaScript制作一个简单的音乐播放器.包括播放.暂停.上一曲和下一曲. 阅读本文章你需要对HTML.CSS和Javascript有基本的了解. 话不多说,先上图. emmm. ...

随机推荐

  1. BZOJ 1787 紧急集合

    LCA.注意细节. #include<iostream> #include<cstdio> #include<cstring> #include<algori ...

  2. POJ 3308 Paratroopers (对数转换+最小点权覆盖)

    题意 敌人侵略r*c的地图.为了消灭敌人,可以在某一行或者某一列安置超级大炮.每一个大炮可以瞬间消灭这一行(或者列)的敌人.安装消灭第i行的大炮消费是ri.安装消灭第j行的大炮消费是ci现在有n个敌人 ...

  3. (C#基础) byte[] 之初始化, 赋值,转换。

    byte[] 之初始化赋值 用for loop 赋值当然是最基本的方法,不过在C#里面还有其他的便捷方法. 1. 创建一个长度为10的byte数组,并且其中每个byte的值为0. byte[] myB ...

  4. java 调用 .net webservice

    1.首先下载Axis2工具包 2.解压之后用cmd命令进入bin目录WSDL2Java.bat -uri http://192.168.20.42:9999/LoginService.asmx?wsd ...

  5. linux ubuntu 安装jdk

    junluobj@junluobj:~$sudo mkdir /usr/lib/jvmwww.linuxidc.com@linuxidc:~$tar zvxf jdk-8u20-linux-x64.t ...

  6. C#中的局部类

    什么是局部类型? C# 2.0 引入了局部类型的概念.局部类型允许我们将一个类.结构或接口分成几个部分,分别实现在几个不同的.cs文件中. 局部类型适用于以下情况: (1) 类型特别大,不宜放在一个文 ...

  7. C# DataGridView的初始化

    动态添加列和行 方法一 通过手动添加Datatable,再绑定dataGridView DataTable dt = new DataTable();//建立个数据表 dt.Columns.Add(n ...

  8. JVM参数汇总

    一.java启动参数共分为三类: 其一是标准参数(-),所有的JVM实现都必须实现这些参数的功能,而且向后兼容:其二是非标准参数(-X),默认jvm实现这些参数的功能,但是并不保证所有jvm实现都满足 ...

  9. Drupal如何处理系统变量?

    Drupal的系统变量都保存在数据库variable表中: 然后,开发人员可以通过下面的API函数操作这些系统变量: function variable_get($name, $default = N ...

  10. 将数字映射到字母上 .xml

    映射成 A1------A20               B1------B20               ...               Z1------Z20 这种形式   数字从0开始编 ...