2012-04-20 4 views
0

개발중인 웹 사이트에 대한 사용자 지정 계산기를 작성하려고합니다. 나는 새로운 개발자이며 이것은 내 머리 위로 조금이지만 나는 배우려고 노력하고있다.변수가 내 코드를 위반합니다.

나는 2 개의 변수를 가져 와서 1로 결합한 다음이를 사용해 Ajax를 통해 다른 페이지에서 div를 호출하려고합니다. 글쎄, 내가 가지고있는 문제는 2 개의 vars를 결합하는 코드를 추가 할 때 페이지가 끊어지고 그 이유가 확실하지 않다는 것입니다.

 $(function(){ 
     $("input:radio[name=f_1]").click(function() { 
      var type = $(this).val(); 
     }); 
     $("input:radio[name=f_1a]").click(function() { 
      var prod = $(this).val(); 
     }); 

     var JobType = type + prod; 
    }); 

당신은 여기 살고 볼 수 있습니다 : 당신이 JOBTYPE 변수의 선을 가지고가는 경우에 http://rdmproductions.com/dev/

이 페이지가 정상적으로 행동 할 것이다. 나는 무슨 일이 일어나고 있는지, 어떻게 고쳐야하는지 이해하지 못합니다.

답변

1

변수 유형 및 변수는 해당 함수의 범위 내에서만 유효합니다. 또한 onclick 이벤트는 컨트롤이 클릭 될 때만 시작됩니다. 컨트롤이 클릭되면 코드가 실행 된 후 어느 시점에 나타납니다. 페이지가 렌더링 될 때 코드가 실행되는 것처럼 보이므로 사용자는 아직 버튼을 클릭 할 기회가 없습니다. 따라서 사용자가 양식을 작성할 기회가있을 때 논리적 인 시간에 계산을 수행해야합니다. 확실한 후보자는 페이지를 제출하거나 사용자가 버튼을 클릭하는 등의 다른 이벤트를 통해 진행됩니다. 당신은이

+0

나는이 모든 작업에 꽤 귀찮은 사람입니까? – theFAILcoder

+1

Note :'undefined + undefined = NaN' 때문에'JobType'은'NaN'이 될 것입니다. –

+2

이후 코드에서 클릭 핸들러가 언젠가 나중에 실행되고'var JobType = type + prod; 문서 준비 시간에 실행됩니다. – jfriend00

2

귀하의 변수를하는 데 도움이 ... 그냥 같은 라디오에서 값을 연결해야 라디오 버튼에서 온 클릭 이벤트를 사용하는

function onSubmit() { 
    var type = $("input:radio[name=f_1]").val(); 
    var type = $("input:radio[name=f_1a]").val(); 
    var jobType = type + prod; 
    // do something with jobType 
} 

희망이 필요 type하지 않습니다 prod은 로컬 변수이므로 클릭 핸들러 콜백 함수 외부에서 사용할 수 없습니다.

클릭 핸들러 외부에서 사용할 수있게하려면 더 높은 수준의 범위에서 선언하거나 클릭 핸들러 기능의 수명을 초과하여 지속되는 다른 오브젝트에 저장해야합니다.

아마 당신이 원하는 것은 유형의 값을 가져오고 필요할 때 그들을 JobType에 유지하려고 시도하는 것입니다.

이 같은 요구에 따라 데이터를 가져올 수 :

var JobType = $("input:radio[name=f_1]").val() + $("input:radio[name=f_1a]").val(); 

당신은 전혀 두 개의 라디오 버튼의 클릭 핸들러를 필요로하지 않을 것이다. 당신의 최신 의견에 따라


편집 :

당신은 모두가 선택되었을 때 확인, 모두 라디오 그룹에 대한 변경 사항을 듣고 다음과 같은 코드를 사용하여 결합 된 값으로 뭔가를 할 수

:

$("input:radio[name=f_1], input:radio[name=f_1a]").change(function() { 
    var f1 = $("input:radio[name=f_1]:checked").val(); 
    var f1a = $("input:radio[name=f_1a]:checked").val(); 
    if (f1 && f1a) { 
     // both radio buttons have been selected, do something here 
     var jobType = f1 + f1a; 
     // do something with jobType here 
     alert(jobType); 
    } 
}); 

당신은 여기서 일 볼 수 있습니다 http://jsfiddle.net/jfriend00/FJcTA/

+0

을 업데이트 할 때 문서가 준비 될 때 값을 설정합니다. – theFAILcoder

+0

@theFAILcoder -이 제안의 요점은이 코드를 jobtype이 필요한 함수에 넣고 특정 값이 필요할 때만 실행한다는 것입니다 다른 기능의 내부. 요점이 없으므로이 코드를 단독으로 삽입하지 마십시오. 필요할 때 작업 유형을 가져 오십시오. 변수에 저장하지 마십시오. – jfriend00

+0

나는 선택에 대해 "듣기"를 할 수 있기를 바랐다. 그리고 두 변수를 모두 선택하면, 그 중 하나의 변수를 조합 한 다음, 아약스를 통해 무언가를로드한다. – theFAILcoder

0

이 시도 :

$(function() { 

    $("input:radio[name^=f_1]").click(function() { 

     var total = 0;   

     $("input:radio[name^=f_1]").each(function() { 
      total += parseInt($(this).val()); 
     }); 

    }); 

}); 
+0

클릭 핸들러에서'total'을 0으로 재설정해야합니다. – nnnnnn

+0

@nnnnnn 네, 맞습니다. 고마워요. – undefined

0
$(function() { 
    var type, prod, jobType; 
    $("input:radio[name=f_1]").click(function() { 
     type = $(this).val(); 
    }); 
    $("input:radio[name=f_1a]").click(function() { 
     prod = $(this).val(); 
    }); 
    jobType = type + prod; 
}); 
관련 문제