JQuery: подтвердить перед нажатием действия

Question

У меня есть флажок в моей форме. Я хочу попросить пользователя подтвердить, прежде чем он проверит коробку. Однако сообщение «подтвердить» автоматически появляется после того, как поле будет отмечено. Я хочу сделать так, чтобы пользователь мог «отменить», и, как будто он никогда не проверял поле для начала.

Вот мой код:

$(document).ready(function() { 
    $('.checkme').click(function(){ 
    text_area_id = "#" + $(this).val(); 
    if ($(text_area_id).attr('hidden')) { 
     $(text_area_id).attr('hidden', false); 
    } else{ 
     if ($(text_area_id).val() != '') { 
     if (confirm("Clear text for \'" + $(this).val().replace(/_/g, " ") + "\'?")) { 
      $(text_area_id).attr('hidden', true); 
      $(text_area_id).val(''); 
      $(this).attr('checked', true); 
      $('.checkme').attr('checked', true); 
     } 
     } else { 
     $(text_area_id).attr('hidden', true); 
     $('.checkme').attr('checked', true); 
     } 
    } 
    }); 

Обратите внимание на "подтверждение" коробка. Я хочу, чтобы это пришло, щелкнув флажок - но ДО ТОГО, что поле действительно помечается.

Так что я думаю, я ищу функцию JQuery, как

.before_click(function(){ ... 

вместо

.click(function(){ ... 

Или что-то подобное ...?

Answer 1

Просто установите проверенный атрибут флажка на основе вашего значения confirmboolean. window.confirm возвращает true или false

$(".checkme").on('click',function(e){ 
 
    var r = confirm("Are you sure?!"); 
 
    $(this).attr('checked',r); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="checkbox" class="checkme"/>Check me