0

我有一个网站，我需要允许用户输入代码并更改显示的价格。代码是任意的，因为实际价格是代码将导致显示的价格——我只是想让用户觉得他们“特别”。

<h1 style="text-align: center;">Your choice for a one-time investment of just:</br> 
<a title="JUST $797" href="http://samplesite.com" target="_blank">$797</a></h1>
<p style="text-align: center;"><strong>If you'd prefer a totally custom design, <a title="Custom Mobile Site Design" href="http://samplesite.com" target="_blank">click here</a>.</strong></p>
<center><input type="text" id="EnterCode" /><div id="price" value="Code">Enter Code</div></center>

（“a title=”行中的链接是因为我使用的主题不允许我更改字体颜色，所以要让它使用我想要的颜色，我必须让它认为它是一个链接..我将不得不进入 css 并稍后更改它）

所以，给定上面的代码，当前显示的价格是 797 美元。当用户输入任何代码并按回车键时，我希望 797 美元更改为 397 美元。

我在网上找不到任何可以为我指明正确方向的东西，所以我来这里问你们。我真的很感激你能提供的任何帮助。

谢谢！

4

1 回答 1

0

首先，您需要在<a>包含代码的标签中添加一个 ID。像这样的东西：

<a id="yourPriceId" title="JUST $797" href="http://samplesite.com" target="_blank">$797</a>

然后你可以很容易地使用 Javascript 来做你想做的事，使用一个事件监听器来检查用户是否按下了 Enter 键，像这样：

var input = document.getElementById("EnterCode"),
    price = document.getElementById("yourPriceId");

input.addEventListener('keyup', function(e) {
    if (e.keyCode === 13 && !!this.value) {
        price.textContent = "$397";
    }
});

注意：这仅在用户在按 Enter 之前在输入中输入内容时才有效。如果即使用户没有输入任何内容，您也想更改价格，那么只需&& !!this.value从if语句中删除即可。

于 2014-09-23T06:23:36.397 回答