javaseday38补充(下拉菜单改变字体颜色级联菜单制作删除删除附件)

来源：互联网发布：java modbus与rs485 编辑：程序博客网时间：2024/06/05 22:35

<style type="text/css">    .clrclass{        height:50px;        width:50px;        float:left;        margin-right:30px;    }    #text{        clear:left;        padding-top:20px;    }    .selClass{        width:100px;    }</style></head><body>    <script type="text/javascript">        function changeColor(node)        {            var colorVal =  node.style.backgroundColor;             document.getElementById("text").style.color = colorVal;        }    </script>    <div class="clrclass" id="clr1" style="background-color:#0F6" onclick="changeColor(this)"></div>    <div class="clrclass" id="clr2" style="background-color:blue" onclick="changeColor(this)"></div>    <div class="clrclass" id="clr3" style="background-color:red" onclick="changeColor(this)"></div>    <div class="te" id="text">        效果文字的撒打算<br/>        效果文字的撒打算<br/>        效果文字的撒打算<br/>        效果文字的撒打算<br/>    </div>    <hr />    <script type="text/javascript">        function changeColor2()        {            var oSelectNode = document.getElementsByName("selectColor")[0];            //获取所有的option            /*var collOptionNodes = oSelectNode.options;            with(oSelectNode)            {                alert(options[selectedIndex].innerHTML);            }*/            var color = oSelectNode.options[oSelectNode.selectedIndex].value;            document.getElementById("text").style.color = color;            //alert(oSelectNode.options[oSelectNode.selectedIndex].innerHTML);            /*for(var x = 0;x<collOptionNodes.length;x++)            {                alert(collOptionNodes[x].innerHTML);                }   */        }    </script>    <select name="selectColor" onchange="changeColor2()">        <option value="black">选择颜色</option>        <option value="red">红</option>        <option value="blue">蓝</option>        <option value="green">绿</option>    </select>    <select name="selectColor" onchange="changeColor3()" class="selClass">        <option value="black">选择颜色</option>        <option style="background-color:red" value="red">红</option>        <option style="background-color:blue" value="blue">蓝</option>        <option style="background-color:green" value="green">绿</option>    </select></body>

    <script type="text/javascript">        function selectCity()        {            var collCitys = [['选择城市'],['1','2','3','4'],['11','22','33','44']                            ,['111','222','333','444']                            ,['1111','2222','3333','4444']];            //var arr = {"banben":['1','2','3','4']};            //获取两个下拉菜单对象            var oSelNode = document.getElementById("selid");            var oSubNode = document.getElementById("subselid");            //到底选择哪个省            var index = oSelNode.selectedIndex;            //通过角标到容器去获取对应的城市数组            var arrCities = collCitys[index];            //将子菜单中的内容清空            /*for(x = 0;x<oSubNode.options.length;)            {                //alert(oSubNode.options.length);                oSubNode.removeChild(oSubNode.options[x]);              }*/            //清除动作            oSubNode.length=0;            //遍历这个数组并将这个数组的元素封装成option对象添加到子菜单中            for(var x= 0; x<arrCities.length;x++)            {                var oOptNode = document.createElement("option");                oOptNode.innerHTML = arrCities[x];                oSubNode.appendChild(oOptNode);             }        }    </script>    <select id="selid" onchange="selectCity()">        <option>选择省市</option>        <option value="banben">版本</option>        <option>广告</option>        <option>阿三</option>        <option>谔谔</option>    </select>    <select id="subselid">        <option>选择城市</option>    </select></body>

<style type="text/css">table a:link,table a:visited{    color:#03F;    text-decoration:none;}table a:hover{    color:#FF3;}</style><script type="text/javascript">    function addFile()    {        /*            因为文件选取框定义在行对象中            所以只要给表格创建新的行和单元格即可        */          var oTabNode = document.getElementById("fileid");        var oTrNode = oTabNode.insertRow();        var oTdNode_file = oTrNode.insertCell();        var oTdNode_del  = oTrNode.insertCell();        oTdNode_file.innerHTML = "<input type='file'/>";        //oTdNode_del.innerHTML = "<a href = 'javascript:void(0)' onclick='deleteFile(this)'>删除附件</a>";        oTdNode_del.innerHTML = "<img sr='1.jpg' alt='删除' onclick='deleteFile(this)'>";    }    function deleteFile(node)    {        var oTrNode = node.parentNode.parentNode;           oTrNode.parentNode.removeChild(oTrNode);    }</script></head><body>    <table id="fileid">        <tr>            <td><a href="javascript:void(0)" onclick="addFile()">添加附件件</a></td>        </tr>        <!--<tr>            <td> <input type="file" /></td>            <td><a href="javascript:void(0)">删除附件</a></td>        </tr>-->    </table></body>

阅读全文

0 0

javaseday38补充(下拉菜单改变字体颜色 级联菜单制作删除 删除附件)

javaseday38补充(下拉菜单改变字体颜色级联菜单制作删除删除附件)