Question

我有两个单选按钮，每个按钮都会在表单上切换不同的输入。我使用onclick()函数使用hide()来完成此操作，但这需要另一个带有已复制.show()的函数，以便在用户来回切换时将元素恢复。认为必须有更好的逻辑，这不是多余的，也许是一个if toggle的价值？

无论如何，这就是我所拥有的：

<labe>    
    <input type="radio" name="radioReason" onClick="resetPassShow()"> </input
         <span class="text">Request profile update (i.e. phone#)</span>
</label>

<label>
    <input type="radio" name="radioReason" value="resetPassword" onClick="resetPassRemove;"> </input>
    <span class="text">Reset Password or Unlock My Account</span>
</label>

function resetPassRemove(){
    $("#prodCategoryLabel").hide();
    ....
}

function resetPassShow(){
    $("#prodCategoryLabel").show();
    ....
}

Answer 1

以下是JS小提琴：https://jsfiddle.net/dv5xmw9z/1/

<强> JS

function hideA(x) {
   if (x.checked) {
     document.getElementById("A").style.visibility = "hidden";
     document.getElementById("B").style.visibility = "visible";
   }
 }

 function hideB(x) {
   if (x.checked) {
     document.getElementById("B").style.visibility = "hidden";
     document.getElementById("A").style.visibility = "visible";
   }
 }

<强> HTML

<input type="radio" onchange="hideB(this)" name="aorb" checked>A |
<input type="radio" onchange="hideA(this)" name="aorb">B
<div id="A">
  <br/>A's text</div>
<div id="B" style="visibility:hidden">
  <br/>B's text
</div>

Answer 2

使用$( ".target" ).toggle();功能。

http://api.jquery.com/toggle/

用于更改表单输入的单选按钮

2 个答案: