[英]Enter a Code, Change Displayed Price When User Presses Enter
I have a chunk of a website that I need to allow a user to enter a code and have the displayed price change. 我有一部分网站,我需要允许用户输入代码并显示所显示的价格变化。 The code is arbitrary as the actual price IS the price the the code will cause to be displayed - I just wanted the user to feel that they're 'special'.
该代码是任意的,因为实际价格等于该代码将要显示的价格-我只是希望用户感觉到他们是“特殊”商品。
<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>
(The link in the "a title=" line is there because the theme I'm using won't let me change the font color, so to get it to use the color I want, I have to make it think it's a link..I'll have to go into the css and change it later) (“ title =“行中的链接是存在的,因为我正在使用的主题不会让我更改字体颜色,因此要使其使用我想要的颜色,我必须使其认为是链接..我必须进入CSS并稍后进行更改)
So, given the above code, the current price displayed is $797. 因此,给出上述代码,当前显示的价格为$ 797。 When the user enters ANY code and presses enter, I would like the $797 to change to $397.
当用户输入任何代码并按Enter时,我希望将$ 797更改为$ 397。
I couldn't locate anything online that would point me in the right direction, so I came here, to ask you guys. 我在网上找不到任何可以指引我正确方向的东西,所以我来这儿问你们。 I really do appreciate any help you can provide.
我真的很感谢您可以提供的任何帮助。
Thanks! 谢谢!
First of all, you need to add an ID to your <a>
tag that contains the code. 首先,您需要在包含代码的
<a>
标记中添加一个ID。 Something like this: 像这样:
<a id="yourPriceId" title="JUST $797" href="http://samplesite.com" target="_blank">$797</a>
Then you can easily use Javascript to do what you want, using an event listener that checks if the user pressed the Enter key, like this: 然后,您可以使用事件侦听器轻松检查事件是否发生,该事件侦听器可以检查用户是否按下Enter键,如下所示:
var input = document.getElementById("EnterCode"),
price = document.getElementById("yourPriceId");
input.addEventListener('keyup', function(e) {
if (e.keyCode === 13 && !!this.value) {
price.textContent = "$397";
}
});
Note : this will only work if the user enters something in the input before pressing Enter. 注意 :仅当用户在按Enter之前在输入中输入了某些内容时,此方法才起作用。 If you want to chenge the price even if the user doesn't enter anything then just remove
&& !!this.value
from the if
statement. 如果您即使用户不输入任何内容也要调整价格,则只需从
if
语句中删除&& !!this.value
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.