Ввод не будет исчезать, когда я нажимаю на переключатель

Я пытаюсь написать html код css js. в одной его части у меня есть одна группа переключателей (в том числе 2 элемента). Я хочу, чтобы это произошло: если я нажимаю на первое радио, появляется текстовое поле 1, если я нажимаю второй, текстовое поле 1 исчезает и появляется текстовое поле2 и наоборот.Ввод не будет исчезать, когда я нажимаю на переключатель

Этот сценарий происходит, когда я нажимаю на один из них, но он не работает, когда я нажимаю второй.

это мой HTML-код:

<label>Which one do you want to enter?</label> 
<br/> 
<label>Budget:</label> 
<input name = "submethod" id = "submethodbudget" type="radio" value = "bud"/> 
<div id = "smethod" style="display:none"> 
    <input type="text" name = "budgetsub"> 
</div> 
<label>Number of Clicks per Month:</label> 
<input name = "submethod" id= "submethodclicks" type="radio" value = "clckno"/> 
<div id = "smethod2" style="display:none"> 
    <input type="text" name = "clicksnosub"> 
</div> 
<br/>

и это мои ЯШИ:

<script type="text/javascript"> 
    $("#submethodbudget").click(function() { 
     $("#smethod").show("300"); 
     $('#smethod').css('display', ($(this).val() === 'bud') ? 'block':'none'); 
    }); 
    $("#submethodbudget").click(function() { 
     $("#smethod2").hide("300"); 
    }); 
</script> 

<script type="text/javascript"> 
    $("#submethodclicks").click(function() { 
     $("#smethod2").show("300"); 
     $('#smethod2').css('display', ($(this).val() === 'clckno') ? 'block':'none'); 
    }); 
    $("#submethodclicks").click(function() { 
     $("smethod").hide("300"); 
    }); 
</script>

вы можете сказать мне, что я делаю неправильно?

источник

2016-06-25 user6485186

изменение

$("smethod").hide("300");

к:

$("#smethod").hide("300");

Я редактировать код:

<html> 
 
    <head> 
 
    </head> 
 
    <body> 
 
     <label>Which one do you want to enter?</label> 
 
     <br/> 
 
     <label>Budget:</label><input name = "submethod" id = "submethodbudget" type="radio" value = "bud"/> 
 
     <div id = "smethod" style="display:none"> 
 
      <input type="text" name = "budgetsub"> 
 
     </div> 
 
     <label>Number of Clicks per Month:</label><input name = "submethod" id= "submethodclicks" type="radio" value = "clckno"/> 
 
     <div id = "smethod2" style="display:none"> 
 
       <input type="text" name = "clicksnosub"> 
 
      </div> 
 
     <br> 
 
     
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
 
     <script> 
 
      $("#submethodbudget").click(function() { 
 
       $("#smethod").show("300"); 
 
       $('#smethod').css('display', ($(this).val() === 'bud') ? 'block':'none'); 
 
       $("#smethod2").hide("300"); 
 
      }); 
 

 
      $("#submethodclicks").click(function() { 
 
       $("#smethod2").show("300"); 
 
       $('#smethod2').css('display', ($(this).val() === 'clckno') ? 'block':'none'); 
 
       $("#smethod").hide("300"); 
 
      }); 
 
     </script> 
 
    </body> 
 
</html>

источник

2016-06-25 13:40:14 Ehsan

Попробуйте,

$(document).ready(function(){ 
    $("#submethodbudget").click(function(){ 
     $("#smethod").show(200); 
       $("#smethod2").hide(200); 
    }); 
    $("#submethodclicks").click(function(){ 
     $("#smethod2").show(200); 
     $("#smethod").hide(200); 
    }); 
});

Вы даже можете попробовать это, используя метод jquery - css.

источник

2016-06-25 14:10:58 frnt

Ваш код верен! У меня для этого есть какой-то умный код, попробуйте.

$("input[name=submethod]").click(function() {   
     $('div').hide("300"); 
     $(this).next("div").show("300");   
    });

источник

2016-06-25 16:00:54

Ввод не будет исчезать, когда я нажимаю на переключатель

ответ

Смежные вопросы