(052)jquery_事件_change 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
    <title>dom_change.html</title>
    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <style type="text/css">
        div
        {
            margin: 10px 0px;
        }
        select
        {
            width:120px;
        }
    </style>
    <script type="text/javascript" src="../js/jquery/jquery190.js"></script>
    <script type="text/javascript">
        $(function(){
            $("#myselect").bind("change",function(){
                if($(this).val() == "葡萄") {
                    $(this).css("background-color","green");
                } 
                else if($(this).val() == "苹果") {
                    $(this).css("background-color","red");
                }
            });
        });
    </script>
  </head>
  
  <body>
        <h3>下拉列表的change事件</h3>
        <select id="myselect">
            <option value="葡萄">葡萄</option>
            <option value="苹果">苹果</option>
            <option value="荔枝">荔枝</option>
            <option value="香焦">香焦</option>
        </select>
  </body>
</html>

 

posted @ 2014-12-25 11:31  雪中飞雁  阅读(69)  评论(0)    收藏  举报