javascript - 清除 hide <div> 中的输入值

Question

我使用 javascript 来隐藏 div 取决于 radio button 值 例如我取消隐藏 div #one 和填写输入字段并意识到我在错误的交易中，然后单击单选按钮更改所需的交易但不清除所有输入字段。

如果用户在单选按钮上选择，是否有任何方法可以清理输入值(我的意思是清理是清空输入字段)。

脚本

<script>
function showhidediv( rad )
    {
        var rads = document.getElementsByName( rad.name );
        document.getElementById( 'one' ).style.display = ( rads[0].checked ) ? 'block' : 'none';
        document.getElementById( 'two' ).style.display = ( rads[1].checked ) ? 'block' : 'none';
        document.getElementById( 'three' ).style.display = ( rads[2].checked ) ? 'block' : 'none';
    }
</script>

表单

<form action="aef.php" method="post">
  <label>Date</label><br />
  <input type="text" value="<?php echo date('Y-m-d'); ?>" name="date" /><br /><br />

  <input type="radio" name="transtype" value="0" onclick="showhidediv(this);" checked /> LBC Payment
  <input type="radio" name="transtype" value="1" onclick="showhidediv(this);" /> Additional Funds
  <input type="radio" name="transtype" value="2" onclick="showhidediv(this);" /> miscellaneous expense

  <br /><br />
  <div id="one">

   <label>LBC Tracking No.</label><br />
   <input type="text" value="" name="lbc" /><br /><br />

   <label>Transaction Code</label><br />
   <input type="text" value="" name="code" id="code" /><br /><br />

   <label>Credit Amout</label><br />
   <input type="text" name="credit_amout" /> 

  </div>

  <div id="two" class="divhide">
    <label>Debit Amout</label><br />
    <input type="text" name="debit_amout" />
  </div>

  <div id="three" class="divhide">
    <label>Expenses Description</label><br />
    <input type="text" id="expenses" value="" name="description" /><br /><br />

    <label>miscellaneous expense</label><br />
    <input type="text" name="credit_amout" />
  </div>


  <br /><br />
  <input type="submit" value="Add Expenses" name="submit" />
</form>

Answer 1

也许这可以让你知道如何

在 javascript 上

<script>
function showhidediv( rad )
    {
        var rads = document.getElementsByName( rad.name );
        document.getElementById( 'one' ).style.display = ( rads[0].checked ) ? 'block' : 'none';
        document.getElementById( 'two' ).style.display = ( rads[1].checked ) ? 'block' : 'none';
        document.getElementById( 'three' ).style.display = ( rads[2].checked ) ? 'block' : 'none';
        var input = new Array();
        if (rads[0].checked) {
          input = document.querySelectorAll('#one input');
        }

        if (rads[1].checked) {
          input = document.querySelectorAll('#two input');
        }

        if (rads[2].checked) {
          input = document.querySelectorAll('#three input');
        }

        clear_inputs(input);
    }
function clear_inputs(input) {
  for (var i = input.length - 1; i >= 0; i--) {
      input[i].value = '';
    };
}
</script>

你可以根据需要开始修改代码

函数 clear_inputs 将清除输入的值

您可以改进此代码。