<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>Document</title>

        <style type="text/css">

            .option_show {

                display: none;

            }

            .discount {

                width: 70px;

            }

        </style>

    </head>

    <body>

        <select class="select" name="oyhfd">

            <option value="0" selected="selected">请选择</option>

            <option class="option" value="1">足球</option>

            <option class="option" value="2">篮球</option>

            <option class="option" value="3">乒乓球</option>

            <option class="option" value="4">网球</option>

        </select>

        <span style="display:none;" class="option_show">

    <input type="text" class="discount" id="" name="" placeholder="其他球类"/>

  </span>

    </body>

    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

    <script>

        $(".select").on("change", function() {

            if($("option:selected", this).val() == 4) {

                $(".option_show").show();

            } else {

                $(".discount").val("");

                $(".option_show").hide();

            }

        });

    </script>

</html>

select的option触发事件的更多相关文章

  1. javaScript 的option触发事件

    先说jquery的option触发事件,很方便 $("option:selected")//这样就能直接触发选择的option了 在JavaScript中就显得比较麻烦,其实< ...

  2. option触发事件两种方法总结

    代码如下: <!doctype html> <html> <head> <meta charset="UTF-8"> <tit ...

  3. option触发及获取当前选中的option值

    #标签 #<select id="city" class="select"> #JavaScript #$("#city").c ...

  4. 实现 select中指定option选中触发事件

    我们在用到下拉列表框select时,需要对选中的<option>选项触发事件,其实<option>本身没有触发事件方法,我们只有在select里的onchange方法里触发. ...

  5. select选择option时触发的click事件google不兼容问题

    原先的方式,下面代码编写的问题在google浏览器下是触发不了click事件的,具体缘由不清楚,反正都可以概括为不兼容了 碰到问题时,百度到的一篇解决:http://blog.163.com/rihu ...

  6. select中option的onclick事件失效

    html: <select id="pageSelect"> <option value="1" selected onclick=" ...

  7. select列表遍历和触发事件

    1.以下两种都是jquery获取select列表被选中的value.var strText=$("#select_id").find("option:selected&q ...

  8. 通过jquery触发select自身的change事件

    ###通过jquery触发select自身的change事件 1.通过js来去触发select的change事件 代码如下:包含了html部分和js部分 //html部分 <select cla ...

  9. 关于select下拉框选择触发事件

    最开始使用onclick设置下拉框触发事件发现会有一些问题: <select> <option value="0" onclick="func0()&q ...

随机推荐

  1. ExtJs之Ajax模式的表单数据加载

    简单: <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-e ...

  2. ExtJs之Ext.comboBox的远程数据源读取程序

    既然可以测试本地AJAX,那就把书前面的代码作一次学习吧. <!DOCTYPE html> <html> <head> <title>ExtJs< ...

  3. 神经网络入门游戏推荐BugBrain

    今天看到一款神经网络入门游戏.BugBrain.在游戏中,你能够通过连接神经元.设置神经元阈值等建造虫子的大脑,让瓢虫.蠕虫.蚂蚁等完毕各种任务.下载下来玩了玩,难度真不是入门级的= =! 真心佩服作 ...

  4. java 线程 错失的信号、notify() 与notifyAll的使用

    package org.rui.thread.block; import java.util.Timer; import java.util.TimerTask; import java.util.c ...

  5. ajax传对象或者数组到后端

    ajax是无法直接传送对象或者数组,有些人自己处理的话,能够把数据依照自己的标准连接成一个字符串,然后到后端处理.可是数据的不确定性.导致有可能会出错.并且麻烦 事实上有开源的包,能够直接解释成jso ...

  6. 怎样在QML中使用multitouch

    在Qt QML中.它能够利用multitouch来做一些我们想做的事情.在今天的文章中.我们将介绍怎样使用multitouch来做一些我们想做的事. 事实上,在QML中利用多点触控是很easy的一件事 ...

  7. 【移动开发】布局优化利器&lt;include/&gt;和ViewStub

    本文翻译自<50 android hacks> 当创建复杂的布局的时候.有时候会发现加入了非常多的ViewGroup和View.随之而来的问题是View树的层次越来越深,应用也变的越来越慢 ...

  8. luogu3811 【模板】乘法逆元

    题目大意:给出n,求1~n所有数的乘法逆元. 乘法逆元的概念是:如果b*rev(b)≡1 (mod p),p与b互质,则rev(b)就是b的模p乘法逆元.乘法逆元往往用于除法取模. 具体操作详见htt ...

  9. ijkplayer视频播放

      http://android-doc.com/androiddocs/2017/1018/5416.html https://www.2cto.com/kf/201801/714366.html ...

  10. 关于类和对象的进一步讨论 C++

    如果一个类中所有成员函数都是公用的,则可以在定义对象时对数据成员进行初始化: class  Time { public: hour; minute; sec; }; Time t1={14,15,23 ...