on-off 버튼으로 jQuery를 사용하여 웹 페이지 자동 새로 고침

Question

jQuery를 사용하여 내 웹 페이지를 자동 새로 고침하고 싶습니다. 그러나, 내 코드를 시도했지만 전혀 작동하지 않습니다. 문제가 무엇인지 아는 사람이 있습니까?

<div class="page-header-actions" data-toggle="buttons" role="group"> 
      <label class="btn btn-outline btn-primary active"> 
      <input type="radio" name="options" autocomplete="off" value="autorefreshoff" checked /> 
      <i id="btnautorefreshoff" class="icon wb-check text-active" aria-hidden="true"></i>      Auto Refresh Off 
      </label> 
      <label class="btn btn-outline btn-primary"> 
      <input type="radio" name="options" autocomplete="off" value="autorefreshon" /> 
      <i id="btnautorefreshon" class="icon wb-check text-active" aria-hidden="true"></i>      Auto Refresh on 
      </label> 
</div> 

감사합니다 다음

는

<script> 
    $(document).ready(function(){ 
     $("#btnautorefreshon").click(function(){ 
     setTimeout(function() { location.reload() },1500); 
     }); 
    }); 
</script> 

온 - 오프 버튼의 코드입니다.

Answer 1

자동 완성을위한 라디오 버튼은 HTML에 input 태그입니다. 입력란에 고유 한 ID를 추가하여 선택기 라벨을 재조정하면됩니다.

/* $(".btn").on({ 
 
    'click': function() { 
 
    if ($('input#refreshon').is(':checked')) { 
 
     console.log('checked'); 
 
     setTimeout(function() { 
 
      location.reload(); 
 
     }, 1500); 
 
    } 
 
    } 
 
}); */ 
 

 
$('input#refreshon').on({ 
 
    'click': function() { 
 

 
    console.log('checked'); 
 
    setTimeout(function() { 
 
     location.reload(); 
 
    }, 1500); 
 

 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="page-header-actions" data-toggle="buttons" role="group"> 
 
    <label class="btn btn-outline btn-primary active"> 
 
    <input type="radio" name="options" autocomplete="off" value="autorefreshoff" checked /> 
 
    <i id="btnautorefreshoff" class="icon wb-check text-active" aria-hidden="true"></i> Auto Refresh Off 
 
    </label> 
 
    <label class="btn btn-outline btn-primary"> 
 
    <input id="refreshon" type="radio" name="options" autocomplete="off" value="autorefreshon" /> 
 
    <i id="btnautorefreshon" class="icon wb-check text-active" aria-hidden="true"></i> Auto Refresh on 
 
    </label> 
 
</div>