1 回答

TA貢獻(xiàn)1842條經(jīng)驗(yàn) 獲得超22個(gè)贊
首先,很高興包括您到目前為止所嘗試過(guò)的內(nèi)容,也許還有一些您正在使用的代碼,但無(wú)論如何我都會(huì)盡力幫助您。
它允許您將onClick
處理程序分配給一對(duì)單選按鈕。然后,我簡(jiǎn)單地調(diào)整了處理程序以顯示和隱藏相應(yīng)的表單。
我已經(jīng)評(píng)論了您需要更改以添加自己的表單的代碼部分,但目前每個(gè)表單只有一個(gè)測(cè)試輸入和提交按鈕。
<head>
? <script type="text/javascript">
? ? function switchForms() {
? ? ? var sz = document.forms['formSelector'].elements['form'];
? ? ? // loop through list
? ? ??
? ? ? for (var i=0, len=sz.length; i<len; i++) {
? ? ? ? sz[i].onclick = function() { // assign onclick handler? function to each
? ? ? ? ? // change the 'display' style property of the forms to show and hide them
? ? ? ? ? var display;
? ? ? ? ? var dntDisplay;
? ? ? ? ? if (this.value == 1) {
? ? ? ? ? ? display = 1;
? ? ? ? ? ? dntDisplay = 2;
? ? ? ? ? }else{
? ? ? ? ? ? display = 2;
? ? ? ? ? ? dntDisplay = 1;
? ? ? ? ? }
? ? ? ? ? document.getElementById('form' + display).style.display = "block";
? ? ? ? ? document.getElementById('form' + dntDisplay).style.display = "none";
? ? ? ? };
? ? ? }
? ? }
? </script>
</head>
<body onload="switchForms()">
? <form action="#" method="post" class="formSelector" id="formSelector">
? ? <fieldset>
? ? ? <legend>Change form on-click</legend>? ??
? ? ? <p>Select your form:
? ? ? ? <label><input type="radio" name="form" value="1" checked="checked" /> Form 1</label>
? ? ? ? <label><input type="radio" name="form" value="2"? /> Form 2</label>
? ? ? </p>
? ? </fieldset><br>
? </form>
? ??
? <form id="form1" method="post" action="">
? ? <h2>Form 1</h2>
? ? <!-- Insert any input fields you want for form 1 here -->
? ? <label>Input: <input type="text" name="total" class="num" value="" /></label>
? ? <button name="sbt=form1" type="submit">Submit</button>
? </form>
? ??
? <form id="form2" method="post" style="display:none" action="">
? ? <h2>Form 2</h2>
? ? <!-- Insert any input fields you want for form 2 here -->
? ? <label>Input: <input type="text" name="total" class="num" value="" /></label>
? ? <button name="sbt-form2" type="submit">Submit</button>
? </form>
? ??
</body>
添加回答
舉報(bào)