如何根据输入字段动态更改文本


How can I dynamically change text based on input field?

如何根据表单中的输入字段动态更改链接?例如,如果我在输入字段中输入1.00,我想将链接更改为:

donate.php?amount=1.00

其中金额更改为输入字段中指定的金额。

我猜它的JavaScript,这不是我的强项,但任何帮助将是了不起的。:)

谢谢

标记:

<input type="text" id="amount" onkeyup="changeLink(this);" />
<a href="donate.php?amount=0.0" id="donateLink"> donate now! </a>
Javascript:

function changeLink(inputElement)
{
    $('#donateLink').attr("href","donate.php?amount="+inputElement.value);
    //console.log($('#donateLink').attr("href"));
}

这可以通过html表单完成:

<form action="donate.php" method="GET" id="donateform">
    <input type="text" name="amount" />
    <input type="submit" value="Donate" />
</form>

你也可以通过下拉列表输入,这样他们就不会输入无效的值。或者您可以使用javascript验证输入。要使用链接提交表单,可以使用javascript:

<a href="javascript:document.forms['donateform'].submit();">Donate</a>

您不需要做任何事情,只需使用表单。通过对表单使用GET方法并将输入字段命名为"amount",在表单提交时就已经添加到URL中了。当您在框中输入1.00时,请继续尝试提交表单。当页面加载时,您的URL将像预期的那样是donate.php?amount=1.00。URL不需要修改。

如果您使用POST,我只建议不要这样做。