CompleteNoob
CompleteNoob

Reputation: 11

Close the alert div only after clicking the X button a number of times

<div class="alert">
    <span 
        id="button" 
        class="closebtn" 
        onclick="this.parentElement.style.display='none';">&times;
    </span>
    This is an alert box.
</div>

I tried using the alert function but I learned that you can't manipulate it so I created an alert div but I don't know how to achieve the title.

Upvotes: 1

Views: 221

Answers (1)

Michał Szymański
Michał Szymański

Reputation: 354

You can store number of clicks in a variable and when it reaches certain limit, you hide the alert and reset the counter.

let countClicks = 0;

document.querySelector('#button').onclick = function() {
    countClicks++;
  
  if (countClicks === 3) {
    document.querySelector('.alert').classList.add('hidden');
    countClicks = 0;
  }
};
.hidden {
  display: none;
}

#button {
  cursor: pointer;
}
<div class="alert">
  <span>This is an alert box.</span>
  <span id="button" class="closebtn" role="button">&times;</span>      
</div>

Upvotes: 2

Related Questions