change事件用法

来源:互联网 发布:金庸群侠传mac版 编辑:程序博客网 时间:2024/06/17 20:39
//实现效果:下拉菜单中单选框被选中,则显示show1
//否则隐藏
<li>
<select name="field_type" id="" class="rad">
    <option value="input-text">文本框</option>
    <option value="input-radio">单选框</option>
    <option value="input-password">密码框</option>
    <option value="textarea">文本域</option>
</select>
</li>
<li hidden="" class="show1">
                    <span>请填写字段选项:</span>
                    <input type="text" class="filed-name"  placeholder="选项1">
                    <input type="text" class="filed-name" placeholder="选项2">
                </li>
<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
    <script type="text/javascript">
        $(".rad").change(function(){
            //alert($(this).val());
            $(this).parent().next().hide();
            if ($(this).val()=='input-radio') {


             $(this).parent().next().show();
            }
        });

    </script>


//知识点总结
//借鉴网址1:http://www.w3school.com.cn/jquery/event_change.asp


定义和用法


当元素的值发生改变时,会发生 change 事件。


该事件仅适用于文本域(text field),以及 textarea 和 select 元素。


change() 函数触发 change 事件,或规定当发生 change 事件时运行的函数。


注释:当用于 select 元素时,change 事件会在选择某个选项时发生。当用于 text field 或 text area 时,该事件会在元素失去焦点时发生。
//借鉴网址2:https://zhidao.baidu.com/question/553216894.html
<select name="jumpMenu" id="jumpMenu" >
   <option value="1">111</option>  //  111 是显示给用户的信息
   <option value="2">222</option>
   <option value="3">333</option>
   <option value="4">444</option>
   <option  value="5">555</option>
</select>
<script type="text/javascript" src="js/jquery1.8.3.min.js"></script>
<script type="text/javascript">
    $(function(){
           // $("#jumpMenu").val(要选中的option的value值即可);
         $("#jumpMenu").val(4);
    });
</script>
原创粉丝点击