2016-02-28 43 views
0

我有一個5個單選按鈕的垂直無序列表,每2分鐘生成一個動態文本。當點擊按鈕時回到歷史頁面

<ul id="answers_ul"> 
           <li><input class="alternative-letter" id="r1" name="r1" type="radio"><div class="answers_letters">A</div><label class="res1" for="r1"></label><svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"></svg></li> 
           <li><input class="alternative-letter" id="r2" name="r1" type="radio"><div class="answers_letters">B</div><label class="res2" for="r2"></label><svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"></svg></li> 
           <li><input class="alternative-letter" id="r3" name="r1" type="radio"><div class="answers_letters">C</div><label class="res3" for="r3"></label><svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"></svg></li> 
           <li><input class="alternative-letter" id="r4" name="r1" type="radio"><div class="answers_letters">D</div><label class="res4" for="r5"></label><svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"></svg></li> 
           <li><input class="alternative-letter" id="r5" name="r1" type="radio"><div class="answers_letters">E</div><label class="res5" for="r5"></label><svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"></svg></li> 
          </ul> 

問題是以下內容。我在

之下添加一個按鈕
<button class="clean_question"></button> 

由於該類被命名,按鈕的功能是清除單選按鈕(如果選中)的答案。 但是當我點擊它時,頁面會載入歷史上的上一頁!這真的很瘋狂。

我將粘貼關係到clean_question按鈕

CSS

button.clean_question{ 
background-color: #292f33; 
border: 1px solid #55acee; 
width: 60px; 
height: auto; 
margin-top: 5px; 
border-radius: 50%; 
margin-left: -34px; 
float: left; 
padding: 10px 12px; 
z-index: 100; 
position: absolute; 
transition: 0.3s; 
-webkit-transition: 0.3s; 
} 
button.clean_question:hover{ 
transform: scale(1.1,1.1); 
} 
button.clean_question:before{ 
content: url(../images/Examen_Botones_Clean.svg); 
} 

和JS

function resetRadio(el) { 
    [].slice.call($('input[type="radio"][name="' + el.getAttribute('name') + '"]')).forEach(function(el) { 
     var path = el.parentNode.querySelector('svg > path'); 
     if (path) { 
      path.parentNode.removeChild(path); 
     } 
    }); 
} 



jQuery('button.clean_question').on('click', function(){ 
    console.log('llegaste'); 

    selectsArr.forEach(function(obj,i) { 
     [].forEach.call(obj.inputs,function(el){ 
      if (el.getAttribute('type') === 'radio') 
       resetRadio(el); 
     }) 
    }); 

請嘗試喲幫助我的JS和CSS,我真的陷入這個問題。

回答