JQuery와 - 퀴즈/테스트 코드

Question

을 향상 I 해요 그들 만이 또는 상점의 관리자에 의해 주어진 암호를 제공하는 경우가 "테스트/퀴즈"를 전달하면 사용자가 제품을 구입할 수있는 상점을 '시연'. 테스트는 WhatsApp와 같은 인터페이스에서 "발생"합니다. 나는 looong 추한 코드와 끝까지 논리의 비트와 함께 무언가를 할 때 나는 JQuery와 함께하는 일의 대부분

그래서 토글 클래스입니다. (주석)

하자 코드는 그 자체로 이야기 : http://jsfiddle.net/polmoneys/Eje2s/9/

이 작동하지만 질문의 양을 확장 할 경우이 방법을 갈 수있는 끔찍한 방법처럼 보이는 시작합니다. 이 코드는 어떻게 개선 될 수 있습니까? 나는 완전히 마크 업을 변경하고 "위치"접근 방식 (일종의을 내 현재의 지식을 넘어 nth-child(i) 글래머러스 것으로, 루프)를 사용하고 .is(:visible) 및 .next(), 함께 플레이하는 경우는

궁금 해서요.

감사

편집 : 일부 후 시도하고 오류가 나는 특정 코드의 일부를 줄일 수 있습니다 그것은 더 일반적인 (삭제 바이올린 난 단지 게시물 당 두 개의 링크 배치 할 수 있습니다로)

을 은 최종 편집

Flater의 조언 시도 후 나는이 함께했다 : (I는 게시물 당 두 개의 링크를 배치 할 수 있습니다으로 삭제 바이올린)

만 문제는 이제 첫 글자 * 대문자 인 경우 (여기 iOS에서 생각하고) 사용자로 유효한 암호의 reardless에서 두 입력을 받아들이고 방법 퀴즈에 타이머/카운트 다운을 적용하는 방법이 될 것으로 보인다.

1 : 내가 바이올린에 대한 몇 가지 코드를 배치 한, 그것은

메가 최종 편집 해결 모든 문제 : http://jsfiddle.net/polmoneys/ZL5xx/11/

Answer 1

두 끝을 작동 할 수 없습니다. 배열을 사용하십시오 :

var pass_phrase_list = new Array(); 
pass_phrase_list["1"] = "boogedyboo"; 
pass_phrase_list["2"] = "flobbadobbadob"; 
... 

2nd. ID 대신 클래스를 사용하십시오. ID를 사용하여 배열 색인을 식별하십시오. 사용자가 소스의 자바 스크립트 코드를 볼 수 있기 때문에

<input type="button" class="check_click" id="button_1" /> 
<input type="text" class="check_me" id="checkfield_1" /> 

$('.check_click').click(function(event) { 
    var id = $(this).attr("id").replace("button_",""); //gets the id of the button 

    var value = $("#checkfield_"+id).val();   //Gets the value of the input with the same ID. 

    if (value == pass_phrase_list[id]) {    //Checks the input value against the item in the array that has the same index. 
     ... 
    } 

    ... 
}); 

은 물론, 나는 암호 문구 배열을 채울 수있는 또 다른 방법을 제안한다. 하지만 당신은 내가 당신은 새로운 질문 등의로드에 대한 모든 기본 코드에 동일한 방식을 적용 할 수 있습니다

업데이트 ...

Answer 2

Coffeescript이 당신을 도울 수 있습니다 : 무슨 뜻인지 이해 바랍니다. 적어도 코드를보다 읽기 쉽게 만들 수 있고 jquery로 작업하기가 더 쉽습니다. 그것을 사용할 수 있습니까? 나는이 방법에 '일하는거야