任务地址:http://task.zhubajie.com/3275832/

具体要求:

要求
1) 选单样式参照附件
2) 点击第一个选项内容后,跳出第二个选项栏位,并自动更新选项内容
3) 点击第二个选项内容后,跳出第三个选项栏位,并自动更新选项内容(或选项到第二级为止,则停在二级菜单) 
4) 点击第三个选项完成后,跳出第三个选项栏位,并自动更新选项内容
5) 表单需提供客户自行输入内容
6)  选择内容,最终及时返回于页面,并建立 HTML hidden input。

补充模拟流程:
假设一级选单有, 发货、折扣、联系方式等选项,我们以选择发货为例:
发货选择后,第二级菜单跳出,并显示,快递公司及出货时间。

二级菜单选择快递公司,则跳出三级菜单。
二级菜单选择出货时间,则停留在二级菜单,并确定选择内容为出货时间。

三级菜单选择, EMS,则停留在三级菜单,并确定选择内容为EMS。
三级菜单选择, 其它,则跳出文字框让客户自行输入。

以下为简化表

发货(一级选单)
       ----- 快递公司(二级选单)
                         ----- EMS(三级选单)
                         ----- DHL
                         ----- 其它 -> 客户自行文字输入
       ----- 出货时间 (二级选单,选择后无第三选项)

最终返回数值 为
发货 >> 出货时间  或
发货 >> 快递公司 >> EMS 或
发货 >> 快递公司 >> 其它 >> 客户自行输入内容

酬金为800RMB。

请确认好我方需求再行联系。

[威客任务]¥800.00 JS实现网站联动三级选项的更多相关文章

  1. 在freemarker中,价格 怎么将¥100变成 ¥100.00

    ${tempNum?string.currency}或${tempNum?string(“currency”)} à结果为¥20.00${tempNum?string. percent}或${temp ...

  2. js获取网站根目录

    //js获取网站根路径(站点及虚拟目录),获得网站的根目录或虚拟目录的根地址         function getRootPath(){        var strFullPath=window ...

  3. php或js判断网站访问者来自手机或者pc

    php或js判断网站访问者来自手机或者pc机 2013年9月26日,在弄wtuonline的时候为了区分用户是来自手机版浏览器还是pc,针对不同平台选择不同的网站版本,最终总结如下:         ...

  4. php或js判断网站访问者来自手机或者pc机

    php或js判断网站访问者来自手机或者pc机 2013年9月26日,在弄wtuonline的时候为了区分用户是来自手机版浏览器还是pc,针对不同平台选择不同的网站版本,最终总结如下:         ...

  5. JS版本网站资源状态检测

    Title:JS版本网站资源状态检测  --2012-08-28 14:08 前几天需要一个网站状态检测的东东,后面写了个蹩脚的JS版本,里面用到了以前没用过的东西,在这里记下来,其实批处理加curl ...

  6. JS获取网站StatusCode,若存在写入文件

    JS获取网站状态码,若网站存在,写入TXT文件,适用于IE. <script> //写文件      function writeFile(filename,filecontent){   ...

  7. 中文¥乱码 vue js

    /** * * 中文¥格式化,返回格式化后的¥100.00 * @param {any} money */utils.formatCNY = function (money) { let format ...

  8. #2使用html+css+js制作网站教程 测试

    #2使用html+css+js制作网站教程 测试 本系列链接 1 测试 1.1 运行 1.2 审查 1.3 审查技巧 1.4 其他 引言: 编写完代码后就要上机测试代码,获得用户体验,筛选bug 笔者 ...

  9. #1使用html+css+js制作网站教程 准备

    #1使用html+css+js制作网站教程 准备 本系列链接 0 准备 0.1 IDE编辑软件 0.2 浏览器 0.3 基础概念 0.3.1 html 0.3.2 css 0.3.3 js 0.4 文 ...

随机推荐

  1. linux netcat命令

    netcat是网络工具中的“瑞士军刀”,它能通过TCP和UDP在网络中读写数据.通过与其他工具结合和重定向,你可以在脚本中以多种方式使用它.使用netcat命令所能完成的事情令人惊讶. netcat所 ...

  2. C#中的线程(三) 使用多线程

    第三部分:使用多线程 1.  单元模式和Windows Forms 单元模式线程是一个自动线程安全机制, 非常贴近于COM——Microsoft的遗留下的组件对象模型.尽管.NET最大地放弃摆脱了遗留 ...

  3. oracle时间加减的语句写法

    FROM: http://soft.doit.com.cn/article/2012/0105/2850851.shtml --加法 --加1年  SELECT SYSDATE,ADD_MONTHS( ...

  4. 宏HASH_INSERT

    调用 方法 HASH_INSERT(lock_t, hash, lock_sys->rec_hash,lock_rec_fold(space, page_no), lock); /******* ...

  5. 【待填坑】bzoj上WC的题解

    之前在bzoj上做了几道WC的题目,现在整理一下 bzoj2115 去膜拜莫队的<高斯消元解xor方程组> bzoj2597 LCT维护MST bzoj1758 分数规划+树分治+单调队列 ...

  6. 5个难以置信的VS 2015预览版新特性

    Visual Studio 2015 Preview包含了很多强大的新特性,无论你是从事WEB应用程序开发,还是桌面应用程序开发,甚至是移动应用开发,VS 2015都将大大提高你的开发效率.有几个特性 ...

  7. linux下判断网络是否连接

    本文改写自网上的一个程序,原始程序中为阻塞式调用,而且有现成创建的过程,非常不利于集成到自己程序中,因此对原始程序进行改造,使其可以完成发送一个imcp包的方式来判断网络连通,只需要调用改进后的 bo ...

  8. InnoDB关键特性之doublewrite

    部分写失效 想象这么一个场景,当数据库正在从内存向磁盘写一个数据页时,数据库宕机,从而导致这个页只写了部分数据,这就是部分写失效,它会导致数据丢失.这时是无法通过重做日志恢复的,因为重做日志记录的是对 ...

  9. HDU 5285 wyh2000 and pupil

    题意:有一群人,已知某两人之间互相不认识,要把这群人分成两部分,每部分至少一人,且在每部分内没有人互不认识. 解法:图染色.某场bestcoder第二题……看完题觉得是个二分图……完全不会二分图什么的 ...

  10. ChineseCounter.cs 统计中文文本中常用字占比

    http://www.tuicool.com/articles/qmMba2 1 using System; using System.IO; using System.Collections.Gen ...