選擇一個單選按鈕以在jquery / javascript中添加另一個輸入

Question

我正在嘗試通過將所學知識付諸實踐來學習jQuery。 所以，這是我的編碼問題。

我有兩個按鈕，一個“是”和一個“否”。 選擇“是”單選按鈕后，將出現一個新的文本輸入。

我的jquery如下：

$(document).ready(function(){ 
    $("#many").hide();
var isChecked = $("#dform input" ).change(function() {
    $("input[name=question]:checked", "#dform").val();  
  if(isChecked == yes){
    $("#many").show();
  }else {$("#many").hide();}
   });
});

我的密碼筆

我用這個答案在變量中添加了value函數，然后在條件語句中使用了它。 我把值$("input[name=question]:checked", "#dform").val(); 在警報中，以確保已捕獲附加到“是”單選按鈕的值。 但是，當我將.val（）函數放在變量中並在條件語句中使用它時，它將不起作用。

我是否正確設置了Jquery？

Answer 1

試試這個

<script>
$(document).ready(function () {

    $("#many").hide();

    $("input[name='question']").click(function () {

        if ($('#yes').is(':checked')) { $("#many").show(); } 

        else { $("#many").hide(); }
    });
});
</script>

Answer 2

您有點偏離軌道了。 您無需命名onChange處理程序（ var isChecked... ），我認為這使您感到困惑。 我會嘗試一些類似的方法：

$(document).ready(function(){ 
  $("#many").hide();
  $("#dform input[name=question]").change(function() {
    if ($('#dform input[name=question]:checked').attr('value') == 'yes') {
      $("#many").show();
    } else {
      $("#many").hide();
    }
  });
});

Answer 3

試試這個隱藏和顯示元素

$(document).ready(function(){ 
$("#many").hide();
 $("#dform input" ).change(function() {
     $("#many").show();
  });
  $("#no").change(function(){
    $("#many").hide();
  })
});

將html更改為：

<input type="radio" name="question" id="no" value="no" checked>

Answer 4

有不同的方法可以做到這一點，用Jquery addClass和Remove Class方法來做到這一點很簡單

**HTML**
<h4>
Click on button to toggle
</h4>
<div style="padding:10px;">
<button class="show btn">Show</button>
<button class="hide btn">Hide</button>

</div>
<div>
<input type="text" id="name" class="displayN"/>
</div>

jQuery的

$(document).ready(function(){

$(".show").click(function(){
    $("#name").addClass('displayB').removeClass("displayN");
});

$(".hide").click(function(){
    $("#name").addClass("displayN").removeClass("displayB");
})

});

工作示例： https : //jsfiddle.net/mshyam83/u3wfpznn/

Answer 5

請用以下代碼替換您的js：

$(document).ready(function(){ 
    $("#many").hide();
    $("#dform input" ).change(function() {
    var val = $("input[name=question]:checked", "#dform").val();  
     if (val == "yes") {
       $("#many").show();
     } else {
       $("#many").hide();
     }
   });
});

我敢肯定它可以被清理更多，但無論如何它都能正常工作。 jQuery設置很好。 代碼筆： http ： //codepen.io/anon/pen/GqxGmp