js 改变select选项时更新文字样式
http://www.w3school.com.cn/jquery/css_css.asp

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <input type="text" id="test" /><br/>
    <select onchange="changeStyle(this)">
    <option value="red">红色</option>
        <option value="green">绿色</option>
    </select>
    <select onchange="changeStyle(this)">
    <option value="20px">20px</option>
        <option value="30px">30px</option>
    </select>
    <script type="text/javascript">
    var t=document.getElementById('test');
    function changeStyle(th){
    var value=th.value;
    /^[a-z]+$/.test(value)?t.style.color=value:t.style.fontSize=value;

    }
    </script>
    </body>
    </html>
      

  2.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <input type="text" id="test" /><br/>
    <select onchange="changeStyle(this)">
    <option value="red">红色</option>
        <option value="green">绿色</option>
    </select>
    <select onchange="changeStyle(this)">
    <option value="20px">20px</option>
        <option value="30px">30px</option>
    </select>
    <script type="text/javascript">
    var t=document.getElementById('test');
    function changeStyle(th){
    var value=th.value;
    /^[a-z]+$/.test(value)?t.style.color=value:t.style.fontSize=value;

    }
    </script>
    </body>
    </html>