单个输入字段使用到四个位置

时间:2015-08-21 18:17:49

标签: javascript jquery html

在我以前的代码中有四个贷款类型。那四个Loan类型值加载单个输入字段。它是我的旧UI。

links

代码为四种贷款类型的代码。所有贷款类型加载值单个输入字段

Upfront MIP           

现在我新的Ui设计四个贷款类型每个输入字段如何使用这个输入字段四种贷款?

这是我的剧本:

<td width="20%">Type of Loan: </td>
    <td width="30%" >
      <input  type="radio" value="jumbo" name="loantype"  onClick="javascript:loanTypeChanged()"/>  Conforming/Jumbo<br />
      <input type="radio" value="fha" name="loantype" checked onClick="javascript:loanTypeChanged()"/>    FHA<br />
      <input type="radio" value="va" name="loantype" onClick="javascript:loanTypeChanged()" /> VA<br />
      <input type="radio" value="usda" name="loantype"  onClick="javascript:loanTypeChanged()" /> USDA<br />
    </td>

请帮帮我?我有累了输入粘贴四个地方它显示相同值四个地方?

1 个答案:

答案 0 :(得分:0)

您可以利用jQuery缩小代码并使其更简洁。

$('input[name=loantype]').on('change', function() {
    var loanAmount = +$(this).closest('tr').prev().find('input[name=' + this.value + ']').val();
    console.log( this.value, loanAmount );
    //other code
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td width="20%">Loan Values: </td>
    <td>Jumbo: <input name="jumbo" type="number"/></td>
    <td>FHA: <input name="fha" type="number"/></td>  
    <td>VA: <input name="va" type="number"/></td>
    <td>USDA: <input name="usda" type="number"/></td>
  </tr>
  <tr>
  <td width="20%">Type of Loan: </td>
      <td><input  type="radio" value="jumbo" name="loantype"/>  Conforming/Jumbo</td>
      <td><input type="radio" value="fha" name="loantype"/>    FHA</td>
      <td><input type="radio" value="va" name="loantype"/> VA</td>
      <td><input type="radio" value="usda" name="loantype"/> USDA</td>
    </td>
  </tr>
</table>