Необходимо скрыть поля ввода в зависимости от выбора пользователей

У меня в настоящее время школьный проект, и есть заключительная часть, которая должна быть выполнена.Необходимо скрыть поля ввода в зависимости от выбора пользователей

В настоящее время у меня есть форма, где пользователь может написать подробную информацию об «идее оружия» в игру. Однако пользователю нужно сделать выбор, у пользователя есть 3 разных варианта, и в зависимости от того, что они выбирают, поля ввода должны стать невидимыми. Я использую php и jQuery/javascript, чтобы заставить его работать.

Пример PHP Текст:

<form action="create-a-weapon.php" method="post"> 
<input type='hidden' name='reloadtype' /> 
<table> 
     <tr> 
      <td> 
      Base damage: 
      </td> 
      <td> 
      <input type='text' name='Base_Damage' id="Base_Damage" value='<?php echo $Base_Damage; ?>'> 
      </td> 
     </tr> 
     <tr> 
      <td> 
      Max Damage(Maximum rampup): 
      </td> 
      <td> 
      <input type='text' name='Damage' id="Damage" value='<?php echo $Damage; ?>'> 
      </td> 
     </tr> 
     <tr> 
      <td> 
      Pellets: 
      </td> 
      <td> 
      <input type='text' name='Pellets' id="Pell" value='<?php echo $Pell; ?>'> 
      </td> 
     </tr>

Как вы могли заметить, что я использовал один из полей ввода, как «скрытые», потому что мой друг сказал мне, что скрытые поля должны быть сохранены там. Он, к сожалению, ушел, поэтому я не могу получить от него никакой помощи. Я попытался найти его в Интернете, но я не могу найти ничего похожего на него. Я не так хорошо разбираюсь в javascript/jQuery, и я надеюсь, что кто-то может мне помочь. Я добавил источники и все, потому что я использую некоторые поля для вычисления ввода (поэтому я могу написать DPS и т. Д.).

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> 
<script src="script/calculate.js" type="text/javascript"></script>

reloadtype

<div id="dialog-confirm" title="Choose your reload type"> 
<!--<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>--> 
<select> 
    <option value="shells">Shells and projectiles</option> 
    <option value="clip">Clip</option> 
    <option value="No reload">No reload</option> 
</select> 
</div>

Это диалоговое окно в JavaScript

$("#dialog-confirm").dialog({ 
resizable: false, 
height:240, 
width: 340, 
modal: true, 
closeOnEscape: false, 
open: function(event, ui) { $(".ui-dialog-titlebar-close", ui.dialog).hide(); }, 
buttons: { 
"Ok": function() { 
$(this).dialog("close"); 
}, 
} 
});

Спасибо заранее -am

источник

2013-06-09 Atosag

Можете ли вы вдаваться в подробности о 'reloadtype'? –

Обновлено, потому что часть javascript не отображалась. – Atosag

Отредактировано с помощью reloadtype – Atosag

Попробуйте это:

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> 
     <script src="script/calculate.js" type="text/javascript"></script> 
     <script> 
      $(document).ready(function() { 
       $('.reloadtype').change(
        function() { 
         if ($(this).val()=="clip") { 
          $('.pellets').hide(500); 
         } else { 
          $('.pellets').show(500); 
         } 
        } 
       ); 
      }); 
     </script> 
    </head> 
    <body> 
     <form action="create-a-weapon.php" method="post"> 
     <input type='hidden' name='reloadtype' /> 
     <table> 
       <tr> 
        <td> 
        Base damage: 
        </td> 
        <td> 
        <input type='text' name='Base_Damage' id="Base_Damage" value='<?php echo $Base_Damage; ?>'> 
        </td> 
       </tr> 
       <tr> 
        <td> 
        Max Damage(Maximum rampup): 
        </td> 
        <td> 
        <input type='text' name='Damage' id="Damage" value='<?php echo $Damage; ?>'> 
        </td> 
       </tr> 
       <tr class="pellets"> 
        <td> 
        Pellets: 
        </td> 
        <td> 
        <input type='text' name='Pellets' id="Pell" value='<?php echo $Pell; ?>'> 
        </td> 
       </tr> 
     </table> 
     <div id="dialog-confirm" title="Choose your reload type"> 
     <!--<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>--> 
     <select class="reloadtype"> 
      <option value="shells">Shells and projectiles</option> 
      <option value="clip">Clip</option> 
      <option value="No reload">No reload</option> 
     </select> 
     </div> 
    </body> 
</html>

источник

2013-06-09 15:37:01

Это сработало. Большое вам спасибо за спасение жизни! – Atosag

у меня есть этот код, который работает с нажатием кнопки:

<script> 
jQuery(document).ready(function(){ 
jQuery('#hideshow').live('click', function(event) {   
jQuery('#content2').toggle('hide'); 
}); 
}); 
</script>

затем на поле:

<?php 
<p><input type="button" value="Load Template" id="hideshow" /> 
<div id="content2" style="block">

или вы можете использовать @php для проверки выбранного значения.

источник

2013-06-09 15:29:11

Необходимо скрыть поля ввода в зависимости от выбора пользователей

ответ

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