javascript编写实用的省市选择器

省市选择器是大家经常用到的, 但网上找的省市选择器都不是很实用,于是自己写了移动端的省市选择器。

界面:

源码结构:

演示地址:http://component.cform.cn/city/

演示二维码:

源码地址:http://component.cform.cn/city/city.zip

下篇将详细介绍省市选择器的原理与实现。

(0)

相关推荐

  • js实现一个省市区三级联动选择框代码分享

    运行效果:  ================================================= 部分代码: ================================================= 当然首先你数据库中要有这个table,不然你没有数据.....^_^ 复制代码 代码如下: <tr> <td class="tr pr10 "> 所在地: </td> <td class="tl">

  • 基于javascript实现全国省市二级联动下拉选择菜单

    本文实例讲述了js实现全国省市二级联动下拉选择菜单,分享给大家供大家参考.具体如下: 效果图: 具体代码: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="text/javascript"&g

  • 省市选择的简单实现(基于zepto.js)

    效果如下: <div class="clList overflow-h mt75"> <select class="pull-left cl-35 select01" id="cityParent"> <option>请选择省</option> </select> <select class="pull-left cl-35 select02" id="

  • JSON+HTML实现国家省市联动选择效果

    复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>json</title> <script type="text/javascript"> <!-- v

  • js实现的全国省市二级联动下拉选择菜单完整实例

    本文实例讲述了js实现的全国省市二级联动下拉选择菜单.分享给大家供大家参考.具体如下: 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-province-city-cho-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-

  • javascript编写实用的省市选择器

    省市选择器是大家经常用到的, 但网上找的省市选择器都不是很实用,于是自己写了移动端的省市选择器. 界面: 源码结构: 演示地址:http://component.cform.cn/city/ 演示二维码: 源码地址:http://component.cform.cn/city/city.zip 下篇将详细介绍省市选择器的原理与实现.

  • 原生JavaScript编写canvas版的连连看游戏

    本文实例为大家分享了JavaScript编写canvas版的连连看游戏的具体实现代码,供大家参考,具体内容如下 效果图: 实现代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> #box{ /*border: 1px solid #D1D1D1; */ overflow: hidden; pos

  • JavaScript编写棋盘覆盖代码详解

    一.前言 之前做了一个算法作业,叫做棋盘覆盖,本来需要用c语言来编写的,但是因为我的c语言是半桶水(哈哈),所以索性就把网上的c语言写法改成JavaScript写法,并且把它的覆盖效果显示出来 二.关键代码 <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <titl

  • JavaScript实现常用二级省市级联下拉列表的方法

    本文实例讲述了JavaScript实现常用二级省市级联下拉列表的方法.分享给大家供大家参考.具体分析如下: 这里省和市的名称都是动态填充,选择省后自动填充城市 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:/

  • 一个Javascript 编写的代码编辑器

    EditArea : http://sourceforge.net/projects/editarea 特点:1. 一个 Javascript 编写的代码编辑器, 支持代码加亮, 缩进, 行号等特征; 2. A free javascript editor for source code. It allow to write well formated source code with line numerotation, tab support, search & replace (with

  • 用JavaScript编写COM组件的步骤

    支持这些接口的脚本语言有:JavaScript/JScript.VBScript.Perl和Python等. WSC有以下特点.  小巧高效:  易于创建.维护和部署:  提供了创建COM部件的能力:  提供了访问大量系统服务的能力. 用JavaScript编写COM组件的核心工作是完成一个.wsc(Windows Scripting Component)文件..wsc文件是一种标准的XML文件,其格式如下: <?xml version="1.0" encoding=&q

  • javascript基于DOM实现省市级联下拉框的方法

    本文实例讲述了javascript基于DOM实现省市级联下拉框的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>省市级联下拉框</title

  • JavaScript编写简单的计算器

    本文实例讲述了JavaScript编写简单计算器的代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>计算器</title> <style> /*Basic reset*/ *{ margin:0; padding:0; b

  • 从0到1学习JavaScript编写贪吃蛇游戏

    本文实例为大家分享了JavaScript编写贪吃蛇游戏的具体代码,供大家参考,具体内容如下 游戏截图 1.画出游戏界面 var c=document.getElementById("myCanvas"); var cxt=c.getContext("2d");//获取地图 2.给小蛇设置参数 var time = 160 ; //蛇的速度 var x = y = 8; var t = 20; //蛇身长 var map = []; //记录蛇运行路径 var siz

  • JavaScript编写开发动态时钟

    本文实例为大家分享了JavaScript编写开发动态时钟的具体代码,供大家参考,具体内容如下 效果图: 实质上就是调用时间库,再添加一个颜色数组,给显示的时间嵌套一个div盒子,再将颜色数组的颜色设置随机变化,这样就使得时间变化的时候颜色也会发生变化. 完整源代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>网页时钟</title> &l

随机推荐