选择单选按钮时，表单应显示而无需重新加载页面

Question

嗨，我是一名业余程序员。我想让表单动态显示，而无需在用户单击单选按钮后重新加载页面。有什么可以参考的吗？有人可以帮我解决这个问题吗？

这是 HTML 代码

<p>First Name: <input type="text" name="fname" size="15" maxlength="20"/> </p>

<p>Term <select name="term">
    <option value="noterm">No Term</option>
    <option value="1year">1 Year</option>

</select></p>

<p>Enter IMEI: <input type="text" name="imei" size="15" maxlength="20" value=""/> </p>
<p>Selling Price: <input type="text" name="sprice" size="15" maxlength="20" value=""/> </p>
<p>Rep: <input type="text" name="rep" size="5" maxlength="3" value=""/> </p>
<p><input type="submit"name="submit" value="Tender" /></p>


</form>
<!--This is where I need the action to HAPPEN-->
<form>
<input type="radio" name="Credit" value="ISC" /> ISC<br />
<input type="text" name="credit1" size="15" maxlength="10" value=""/>
</form>

Answer 1

最简单的方法是为您的 radio 输入和隐藏的 text 输入提供 id，然后使用以下 JavaScript：

document.getElementById("Credit").onclick = function() {
    document.getElementById("credit1").style.display = "block";
}

您将需要最初隐藏文本 input，您可以在 CSS 中使用 display:none 来完成此操作。您可以在此处查看示例。

如果您能够使用 jQuery，那就更容易了，无需将 id 添加到您的 input 元素，假设您的 name 属性是唯一的：

$("input[name=Credit]").click(function() {
    $("input[name=credit1]").show();
});