form和button和input

form里面不能用button代替<input type="button"/>

button这个按钮直接写在form里面,则看到效果是一瞬间的,是不起作用的,要在form里面添加按钮就采用<input type="button"/>或者把button写在表单外面,则作用是一样的

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <form action="" >
            <select name="selectt" id="sel">
                <option value="水果1">苹果</option>
                <option value="水果2">香蕉</option>
                <option value="水果3">栗子</option>
            </select>
            
        </form>
        <br /><br /><br /><br /><br />
            <button onclick="setdisable()">按钮1</button><br/>
            <button onclick="setenable()">按钮2</button><br />
            <button onclick="setlength()">按钮3</button><br />
            <button onclick="setsize()">按钮4</button><br />
            <button onclick="setdel()">按钮5</button><br />
            <button onclick="changetext()">按钮6</button><br />
            <button onclick="shuchu()">按钮7</button><br />
            <button  onclick="setmultiple()">按钮8</button>
        <script>
            var x=document.getElementById("sel");
            
            function setdisable()//按钮1
            {
             x.disabled=true;
            }
            
            function setenable()//按钮2
            {
                x.disabled=false;
            }
            function setlength()//按钮3
            {
                alert(x.length);
                
            }
            function setsize()//按钮4
            {
               x.size=3;
            }
            function setdel()//按钮5
            {
                x.remove(x.selectedIndex);
            }
            function changetext()//按钮6
            {
                x.options[x.selectedIndex].text="西瓜";
            }
            function shuchu()//按钮7
            {var txt="选中的水果有:
";
            for(var i=0;i<x.length;i++)
            {if(x.options[i].selected)
                txt+=x.options[i].text+"
";
            }
            
                alert(txt);
            }
            function setmultiple()
            {
                x.multiple=true;
            }
            
            
        </script>
    </body>
</html>
原文地址:https://www.cnblogs.com/hsl541/p/13215637.html