切换器 php. 我的问题是关于切换器的。当我切换并且表单应该动态更改时

http://img2.mukewang.com/6442576500017b1f12800795.jpg

我有 3 个选择。它们是椅子、战争与和平、极光唱片。切换器 php. 我的问题是关于切换器的。当我切换时,表格应该动态更改。我是 php 的初学者。


<!DOCTYPE html>

    <html>

    <head>

        <title>Product add</title>

        <link rel="stylesheet" href="style.css">

    </head>

    <body>

        <div class="PrAd">

            <h2>

                <b>Product Add</b>

                <button class="button">Save</button>

            </h2>

            <hr>

        </div>

        <div class="form">

            <form>

                <label for="SKU">SKU</label>

                <input type="text" id="formbox" name="SKU"><br>

                <label for="Name ">Name</label>

                <input type="text" id="formbox" name="Name"><br>

                <label for="Price">Price</label>

                <input type="number" id="formbox" name="Price"><br>

                <label>Type Switcher</label>

                <select id="type" name="product">

                    <option value="Acme Disc">Acme Disc</option>

                    <option value="War and Peace">War and Peace</option>

                    <option value="Chair">Chair</option>

                </select>

            </form>

        </div>

        <?php  


        ?>

    </body>

    </html>


MMMHUHU
浏览 87回答 1
1回答

绝地无双

function prodType(prod){&nbsp; var acmeAttributes = document.getElementById("acme_disc_attributes");&nbsp; var warPeaceAttributes = document.getElementById("war_peace_attributes");&nbsp; var chairAttributes = document.getElementById("chair_attributes");&nbsp;&nbsp;&nbsp; acmeAttributes.style.display="none";&nbsp; warPeaceAttributes.style.display="none";&nbsp; chairAttributes.style.display="none";&nbsp;&nbsp;&nbsp; if(prod=="Acme Disc"){&nbsp; &nbsp; acmeAttributes.style.display="block";&nbsp; }else if(prod=="War and Peace"){&nbsp; &nbsp; warPeaceAttributes.style.display="block";&nbsp; }else if(prod=="Chair"){&nbsp; chairAttributes.style.display="block";&nbsp; }}.fieldbox{display:none;}<!DOCTYPE html>&nbsp; &nbsp; <html>&nbsp; &nbsp; <head>&nbsp; &nbsp; &nbsp; &nbsp; <title>Product add</title>&nbsp; &nbsp; &nbsp; &nbsp; <link rel="stylesheet" href="style.css">&nbsp; &nbsp; </head>&nbsp; &nbsp; <body>&nbsp; &nbsp; &nbsp; &nbsp; <div class="PrAd">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <h2>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <b>Product Add</b>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button class="button">Save</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </h2>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <hr>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; <div class="form">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <form>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label for="SKU">SKU</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" id="formbox" name="SKU"><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label for="Name ">Name</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" id="formbox" name="Name"><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label for="Price">Price</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="number" id="formbox" name="Price"><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label>Type Switcher</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <select id="type" name="product" onChange="prodType(this.value);">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="">Choose Switcher</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="Acme Disc">Acme Disc</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="War and Peace">War and Peace</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <option value="Chair">Chair</option>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </select>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="fieldbox" id="acme_disc_attributes">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label>Size</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" name="size" value="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="fieldbox" id="war_peace_attributes">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label>Weight</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" name="weight" value="">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="fieldbox" id="chair_attributes">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <label>Length</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" name="length"><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<label>Width</label>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" name="width"><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </form>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; </body>&nbsp; &nbsp; </html>
打开App,查看更多内容
随时随地看视频慕课网APP