2017-11-01 11 views
0

라디오 박스의 체크 된 값을 저장하고 싶지만 버튼을 전송하려고 시도 할 때 3 가지 선택 사항을 기반으로하는 URL로 리디렉션하려고하면 작동하지 않습니다. 디버깅을했는데 문제는 내 프로그램이 변수의 마지막 값만 저장하고 이전 값은 저장하지 않는다는 것입니다. 3 가지 변수로 모든 선택 사항을 저장하려면 어떻게해야합니까?변수에 라디오 박스 값 저장

HTML :

<div id="schritt1"> 
     <p stlye="text-align:center;">frage 1</p> 
     <input id="1a" type="radio" name="a" value="eins" onclick="checkedvalue('a')"/> 
     <label for="1a">1</label><br/> 
     <input id="1b" type="radio" name="a" value="zwei" onclick="checkedvalue('a')"/> 
     <label for="1b">2</label></br> 
     <input id="1c" type="radio" name="a" value="drei" onclick="checkedvalue('a')"/> 
     <label for="1c">3</label> 

    </div> 

    <div id="schritt2" style="display:none;"> 
     <p stlye="text-align:center;">Frage 2</p> 
     <input id="2a" type="radio" name="b" value="zweieins" onclick="checkedvalue('b')"/> 
     <label for="2a">1</label><br/> 
     <input id="2b" type="radio" name="b" value="zweizwei" onclick="checkedvalue('b')"/> 
     <label for="2b">2</label></br> 
     <input id="2c" type="radio" name="b" value="zweidrei" onclick="checkedvalue('b')"/> 
     <label for="2c">3</label> 
    </div> 

    <div id="schritt3" style="display:none;"> 
     <p stlye="text-align:center;">Frage 3</p> 
     <input id="2a" type="radio" name="c" value="dreieins" onclick="checkedvalue('c')"/> 
     <label for="2a">1</label><br/> 
     <input id="2b" type="radio" name="c" value="dreizwei" onclick="checkedvalue('c')"/> 
     <label for="2b">2</label></br> 
     <input id="2c" type="radio" name="c" value="dreidrei" onclick="checkedvalue('c')"/> 
     <label for="2c">3</label> 
    </div> 

    <div id="finish-button" style="display:none;"> 
     <a class="btn btn-buy" onclick="checkedvalue('finish')">Ergebnis</a> 

    </div> 

JS :

<script> 
function checkedvalue(choice){ 
var eins; 
var zwei; 
var drei; 

if(choice == "a") { 


    eins = (jQuery('input[name=a]:checked').val()); 
    window.alert(eins); 
document.getElementById('schritt1').style.display = 'none'; 
document.getElementById('schritt2').style.display = 'block'; 
} 


else if(choice == "b") { 


    zwei = (jQuery('input[name=b]:checked').val()); 
    window.alert(zwei); 
    window.alert(eins + zwei); 
    document.getElementById('schritt2').style.display = 'none'; 
    document.getElementById('schritt3').style.display = 'block'; 
    document.getElementById('finish-button').style.display = 'block'; 
} 



else if(choice == "c") { 


    drei = (jQuery('input[name=c]:checked').val()); 

} 

else if(choice == "finish") { 
    window.alert(eins + zwei + drei); 

    if(eins == "eins" && zwei == "zweieins" && drei == "dreieins") 
    { 
    console.log("If 2 works"); 
    window.location.href = "//"; 
    } 
} 

} 

+0

라디오 버튼에 value 속성이 있고, 같은 값으로 checkedvalue ('a')'를 호출하는 보이는 라디오 버튼도 있습니다. 'onclick = "checkedvalue ('b ')'와 'onclick = "checkedvalue ('c')'? – azs06

답변

2

문제는이 온 클릭 할 때마다입니다() 메소드 호출과는 느슨하게 할 자바 스크립트 method.So을합니다 새로 고침 이전에 저장된 값.

당신은

var eins; 
var zwei; 
var drei; 

은 (모든 기능 이외) 전 세계적으로 이러한 변수를 선언하여 폼 제출시 모든 라디오 버튼 그룹의 값을 수집하고 (방법을 제출하세요 OnSubmit 방법을 쓰기 형태의 내부 코드 아래에 추가 할 수 있습니다 제출 버튼에 코드를 작성하십시오)

$('input:radio').each(function() { 
if($(this).is(':checked')) { 
    // You have a checked radio button here... 
var val = $(this).val(); 
var name = $(this).attr('name'); 
if(name=="a") 
{ 
    eins=val; 
} 
else if(name=="b") 
{ 
zwei=val; 
} 
else 
{ 
drei=val; 
} 
} 
else { 
// Or an unchecked one here... 
} 
}); 

코드를 테스트하지 않았으므로 요구 사항에 따라 수정하십시오.

+0

전역 변수를 선언하는 첫 번째 힌트를 보내 주셔서 감사합니다. 두 번째 코드는 양식이나 양식을 제출할 필요가 없으므로 실제로 필요하지 않습니다. – erik7

+0

Oh.Nice .환영. –