123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title></title>
- <meta http-equiv="content-type" content="text/html;charset=utf-8">
- <!--1473基础js类-->
- <script src="http://www.1473.cn/uform.js" type="text/javascript"></script>
- <!-- <script src="http://nodejs.1473.cn/crossdomain.js" type="text/javascript"></script>-->
- <link href="http://nodejs.1473.cn/css/UCity/U.City.css" rel="stylesheet" type="text/css" />
- <script type="text/javascript">
- Namespace.register("U.City"); //命名空间
- window.onload = function () {
- U.CD.Host = "192.168.100.61"; //需要更换数据库host,在这里更换
- U.CD.Database = "UseStudio_CityS"; //需要更换数据库名字,在这里更换
- U.CD.AjaxUrl = "http://nodejs.1473.cn/";
- U.CD.LIFA([["U_ACD", "http://nodejs.1473.cn/CD.htm", "ACD"]]);
- //U.CD.Init(); //初始化跨域文件
- //其他初始化写在下面
- //U.ACD.Request(U.CD.AjaxUrl, ([U.CD.Host, U.CD.Database, "UC_S_Select_Sta", '0']), U.Exam.aa_asyn, (["", "bb"]));
- //---------------------------db 为数据库名字, r为 存储过程函数, val为该存储过程的参数 若没有参数可以不传 若有多个参数采用数组的方法,
- //-----------------------------------------------------------------------------------例如传入 [a,b] 查看下面 div文本为北京的元素
- //U.City.init(, $("#qq")[0]); //第一个参数是作为 放入哪个元素下 //第二个参数是元素点击提交数据
- }
- U.CD.AsynJWH = function () {
- }
- U.City.init = function (a) {
- if (!$("#U_City")[0]) {
- U.City.Element = a;
- var ss = $$("div", { "id": "soi", "style": { "width": US.Width + "px", "height": US.Height + "px", "position": "absolute", "z-index": "28", "left": "0px", "top": "0px"} }, document.body)
- var B = $$("div", { "style": { "border": "1px solid #ccc", "width": "240px", "position": "absolute", "z-index": "30" }, "id": "U_City" }, document.body);
- var B_T = $$("div", { "className": "Ul", "style": { "width": "100%"} }, B);
- var Pro = $$("div", { "id": "Pro", "className": "newcolor", "innerHTML": "省份", "onclick": [[U.City.ChangeNow, (["Pro"])]] }, B_T);
- var City = $$("div", { "id": "City", "className": "oldcolor", "innerHTML": "城市", "onclick": [[U.City.ChangeNow, (["City"])]] }, B_T);
- var area = $$("div", { "id": "area", "className": "oldcolor", "innerHTML": "县区", "onclick": [[U.City.ChangeNow, (["area"])]] }, B_T);
- $$("div", { "style": { "clear": "both"} }, B_T);
- //var a = $$("a", { "style": { "background": "#f5f5f5", "border-bottom": "1px solid #fff", "color": "#f60", "display": "inline", "float": "left", "padding": "8px 20px", "color": "#4D4D4D" }, "innerHTML": "街道" }, B_T);
- var B_B = $$("div", { "style": { "width": "100%", "height": "100%", "display": "inline", "float": "left", "margin": "10px 0 10px 0" }, "className": "B_B" }, B);
- U.ACD.Request(U.CD.AjaxUrl, ([U.CD.Host, U.CD.Database, "UC_S_Select_Pro", 1, 1]), U.City.Pro, (["", "bb"]));
- $$("div", { "style": { "clear": "both"} }, B);
- ss.onclick = function () { U.City.Del("U_City"); U.City.Del("soi"); }
- }
- }
- U.City.Pro = function (c) {
- for (var i = 0; i < c.value[0].length; i++) {
- //, "onclick": [[U.City.Pro, [(c.value[0][i].region_id)]]]
- $$("a", { "innerHTML": c.value[0][i].region_name, "id": c.value[0][i].region_id, "onclick": [[U.City.Value, ([c.value[0][i].region_name, c.value[0][i].region_id, "pro"])], [U.City.City, ([c.value[0][i].region_id, "City"])]], "style": { "display": "inline-block", "color": "#4d4d4d", "padding": "0 10px", "outline": "0", "text-decoration": "none", "white-space": "nowrap", "margin-right": "2px", "line-height": "14px", "font-size": "12px", "cursor": "pointer"} }, $(".B_B")[0]);
- }
- $$("div", { "style": { "clear": "both"} }, $(".B_B")[0]);
- }
- U.City.City = function (r, b) {
- U.City.IsProID = r;
- if (b) { U.City.ChangeNow(b); }
- $(".B_B")[0].innerHTML = "";
- $("#City")[0].style.background = "#fff";
- $("#Pro")[0].style.background = "#f5f5f5";
- var ad = U.ACD.Request(U.CD.AjaxUrl, ([U.CD.Host, U.CD.Database, "UC_S_Select_Pro", r, 2]), "", (["", "bb"]));
- for (var i = 0; i < ad.value[0].length; i++) {
- //, "onclick": [[U.City.Pro, [(c.value[0][i].region_id)]]]
- $$("a", { "innerHTML": ad.value[0][i].region_name, "id": ad.value[0][i].region_id, "onclick": [[U.City.Value, ([ad.value[0][i].region_name, ad.value[0][i].region_id, "city"])], [U.City.area, ([ad.value[0][i].region_id, "area"])]], "style": { "display": "inline-block", "color": "#4d4d4d", "padding": "0 10px", "outline": "0", "text-decoration": "none", "white-space": "nowrap", "margin-right": "2px", "line-height": "14px", "font-size": "12px", "cursor": "pointer"} }, $(".B_B")[0]);
- }
- $$("div", { "style": { "clear": "both"} }, $(".B_B")[0]);
- }
- U.City.area = function (r, b) {
- U.City.IsCityID = r;
- if (b) { U.City.ChangeNow(b); }
- $(".B_B")[0].innerHTML = "";
- $("#area")[0].style.background = "#fff";
- $("#City")[0].style.background = $("#Pro")[0].style.background = "#f5f5f5";
- var ad = U.ACD.Request(U.CD.AjaxUrl, ([U.CD.Host, U.CD.Database, "UC_S_Select_Pro", r, 3]), "", (["", "bb"]));
- for (var i = 0; i < ad.value[0].length; i++) {
- //, "onclick": [[U.City.Pro, [(c.value[0][i].region_id)]]]
- $$("a", { "innerHTML": ad.value[0][i].region_name, "id": ad.value[0][i].region_id, "onclick": [[U.City.Value, ([ad.value[0][i].region_name, ad.value[0][i].region_id, "area"])]], "style": { "display": "inline-block", "color": "#4d4d4d", "padding": "0 10px", "outline": "0", "text-decoration": "none", "white-space": "nowrap", "margin-right": "2px", "line-height": "14px", "font-size": "12px", "cursor": "pointer"} }, $(".B_B")[0]);
- }
- $$("div", { "style": { "clear": "both"} }, $(".B_B")[0]);
- }
- U.City.Value = function (a, b, c) {
- if (c == "pro") {
- U.City.Element.value = "";
- }
- else if (c == "city") {
- var oi = U.City.Element.value.split("/");
- U.City.Element.value = oi[0] + "/";
- }
- else if (c == "area") {
- var oi = U.City.Element.value.split("/");
- U.City.Element.value = oi[0] + "/" + oi[1] + "/";
- }
- $("#" + b)[0].style.backgroundColor = "#ccc";
- var oi = U.City.Element.value.split("/");
- if (oi.length == 3) { U.City.IsArea = b; U.City.Element.value += a; U.City.Del("U_City"); U.City.Del("soi") }
- else U.City.Element.value += a + "/";
- }
- U.City.Del = function (a) {
- $("#" + a).remove();
- }
- U.City.ChangeNow = function (a) {
- $("#Pro")[0].className = "oldcolor";
- $("#City")[0].className = "oldcolor";
- $("#area")[0].className = "oldcolor";
- $("#" + a)[0].className = "newcolor";
- $(".B_B")[0].innerHTML = "";
- if (a == "Pro") { U.City.Del("U_City"); U.City.init(U.City.Element); }
- else if (a == "City") {
- if (U.City.IsProID) { U.City.City(U.City.IsProID); }
- }
- else if (a == "area") { if (U.City.IsCityID) { U.City.area(U.City.IsCityID); } }
- }
- </script>
- </head>
- <body>
- <input id="oi" style="width: 240px; height: 30px; line-height: 30px; border: 1px solid #ccc;"
- onclick="U.City.init(this)" />
- </body>
- </html>
|