2014-09-23 4 views
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> 

합니다 (의 링크 "는 제목 ="라인은 내가 사용 주제는 내가 가지고, 내가 그래서 내가 원하는 색상을 사용하여 얻을 수, 글꼴 색상을 변경할 수 없기 때문에이 그것이 링크라고 생각하게 만들 수 있습니다. 나는 CSS에 들어가서 나중에 바꿔야 할 것입니다.)

따라서 위의 코드에서 현재 표시된 가격은 $ 797입니다. 사용자가 모든 코드를 입력하고 Enter 키를 누르면 797 달러를 397 달러로 변경하고 싶습니다.

올바른 방향으로 나를 가리키게하는 온라인 사이트를 찾을 수 없으므로 여기에 와서 물어 보았습니다. 당신이 제공 할 수있는 도움에 정말 감사드립니다.

감사합니다.

+1

"사용자 Gmail 계정에 사용자 이름과 암호를 입력하면됩니다. 코드를 입력하십시오." .. 좋은 슬픔. –

+0

질문의 제목에 답변 할 필요가 없습니다. 답변이 선택되면 메인 페이지에 연두색이 표시되어 사람들이 답을 얻었음을 알 수 있습니다. – Rimble

답변

0

먼저 코드가 포함 된 <a> 태그에 ID를 추가해야합니다. 이런 식으로 뭔가 :

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

그런 다음 당신은 쉽게 다음과 같이 사용자가 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을 삭제하면됩니다.

+0

감사합니다! 그것은 내가 필요로했던 바로 그 것이었다. 너 멋지다! –

관련 문제