有时候我们在一些表单搜集信息的时候，需要根据上一项的选择情况设定下面的某些输入信息是否显示，是否需要被收集等，这个时候就要对下拉列表的选择事件做一个监听。

代码如下：

<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.js"></script>

</head>

<body>

    <div>

        <table>

            <tr>

                <td>链接类型</td>

                <td>

                    <select name="link_type">

                        <option value="text">文本链接</option>

                        <option value="logo">logo链接</option>

                    </select>

                </td>

            </tr>

            <tr id="logo_div" style="display:none;">

                <td>上传Logo</td>

                <td>

                    <input type="text" name="" id="" />

                </td>

            </tr>

        </table>

    </div>

    <script type="text/javascript">

        $(function(){

            //页面加载完毕后开始执行的事件

            $("select[name='link_type']").change(function(){

                if($(this).val()=="logo")

                {

                    $("#logo_div").show();

                }else{

                    $("#logo_div").hide();

                }

            });

        });

    </script>

</body>

</html>

效果如下：

jquery如何书写一个根据下拉选择列表的选择值 控制其他标签时候显示的功能的更多相关文章

  1. 关于下拉框列表不可选择相同值的设置一：当前DOM不可选

    <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...

  2. 模块：（日期选择）jquery、bootstrap实现日期下拉选择+bootstrap jquery UI自带动画的日期选择器

    一:jquery.bootstrap实现日期下拉选择 点击文本框弹出窗口 弹窗显示日期时间选择下拉 年份取当前年份的前后各5年 天数随年份和月份的变化而变化 点击保存,文本框中显示选中的日期 代码部分 ...

  3. 原生js实现一个自定义下拉单选选择框

    浏览器自带的原生下拉框不太美观,而且各个浏览器表现也不一致,UI一般给的下拉框也是和原生的下拉框差别比较大的,这就需要自己写一个基本功能的下拉菜单/下拉选择框了.最近,把项目中用到的下拉框组件重新封装 ...

  4. 使用jQuery为文本框、单选框、多选框、下拉框、下拉多选框设值及返回值的处理

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. 第二百一十二节，jQuery EasyUI，Combo(自定义下拉框)组件

    jQuery EasyUI,Combo(自定义下拉框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Combo(自定义下拉框)组件的使用方 ...

  6. jQuery插件：模拟select下拉菜单

    没搞那么复杂,工作中,基本够用.. <!doctype html> <html> <head> <meta charset="utf-8" ...

  7. Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢)

    Jquery操作下拉框(DropDownList)的取值赋值实现代码(王欢) 1. 获取选中项: 获取选中项的Value值: $('select#sel option:selected').val() ...

  8. 雷林鹏分享：jQuery EasyUI 表单 - 格式化下拉框

    jQuery EasyUI 表单 - 格式化下拉框 本教程向您展示如何创建一个简单的下拉框(Combobox),让它在下拉框中显示图片项.您可以在下拉框(combobox)上使用 formatter ...

  9. angular2.x 下拉多选框选择组件

    angular2.x - 5.x 的下拉多选框选择组件 ng2 -- ng5.最近在学angular4,经常在交流群看见很多人问 下拉多选怎么做... 今天就随便写的个. 组件源码 百度云   链接: ...

随机推荐

  1. 【转帖】Sigma水平和缺陷率的对应关系：正态分布中心和1.5标准差偏移

    http://www.pinzhi.org/thread-5395-1-1.html Sigma水平和缺陷率的对应关系:正态分布中心和有1.5个标准差偏移 在过程稳定时,若给出了规范限,过程的平均与标 ...

  2. FFmpeg命令添加视频字幕

    FFmpeg添加字幕 首先需要科普下.vob,mkv等格式文件以流的形式存储字幕,而mp4不支持这种方式.如果希望生成带字幕的mp4文件,只能将字幕“烧录”到视频中. 也就是说我们需要将字幕流与视频流 ...

  3. 大比速：remoting、WCF(http)、WCF(tcp)、WCF(RESTful)、asp.net core(RESTful) .net core 控制台程序使用依赖注入（Autofac）

    大比速:remoting.WCF(http).WCF(tcp).WCF(RESTful).asp.net core(RESTful) 近来在考虑一个服务选型,dotnet提供了众多的远程服务形式.在只 ...

  4. CSC时无法找到C:\Program Files\Microsoft SDKs\Windows\v6.0A\lib

    偶然用到CSC编译c#程序,出现如下问题: warning CS1668: “LIB 环境变量”中指定的搜索路径“C:\Program Files\Microsoft        SDKs\Wind ...

  5. tp类型自动转换和自动完成

    一.类型自动转换 在模型中对数据库字段自动完成 //模型中数据类型自动转换 添加一个$type数组即可protected $type=array( 'username'=>'serialize' ...

  6. java中加密解密工具类

    在工作中经常遇到需要加密.解密的场景.例如用户的手机号等信息,在保存到数据库的过程中,需要对数据进行加密.取出时进行解密. public class DEStool { private String ...

  7. unity, 导出对象到另一个项目

    ----更新(2015-6-26): 今天又试了一下,有时候prefabs不用导出直接拷贝过去也能用,但有时候不行.还不太清楚原因. ----旧帖: 一,正确做法: 一个对象包括资源和Hierarch ...

  8. Java模拟公司置办货物系统（二）

    採用MVC风格,将数据写入文件,模拟公司置办货物系统.  A类表示普通员工,B类表示部门精力,C类表示採购部,D类表示资源管理部. 订单状态 1.表示申请状态 2.表示通过审批 3.表示未通过审批 4 ...

  9. swift 类型.

    swift 类型 变量声明 用let来声明常量,用var来声明变量 可以在一行中声明多个常量或者多个变量,用逗号隔开 var x = 0.0, y = 0.0, z = 0.0 类型安全 Swift ...

  10. ThreadPoolExecutor线程池解析与BlockingQueue的三种实现

    目的 主要介绍ThreadPoolExecutor的用法,和较浅显的认识,场景的使用方案等等,比较忙碌,如果有错误还请大家指出 ThreadPoolExecutor介绍 ThreadPoolExecu ...