在引导中显示警报不起作用

Question

Here is the code

<script type="text/javascript">
window.setTimeout(function() {
$("#alert_message").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 10000);
</script>
<div id="alert_message" class="alert" style="width:100%;" >
<span>If download button does not work. Right click on the meme and click save as...</span><span class="close" style="float:right;" data-dismiss="alert">&times;</span>
</div>

Now on page load the alert appears. I wrote the following code to make it appear again on click of a check box.

else if(document.getElementById('31').checked) {
src = 'http://qph.is.quoracdn.net/main-qimg-7212ce8aa821a3af3d91ee709f3fd7f1?convert_to_webp=true';
$( "#alert_message" ).toggle();
}

It does not become visible again with this code.

Answer 1

use

$("#alert_message").css("display", "none");

instead of

$(this).remove();

then:

$(document).ready(function () {
       $("#31").on('click', clicked);
       function clicked() {
        if($('#31').is(':checked')) { 
        // your code 
       $("#alert_message").css("display", "block");
      // or $("#alert_message").toggle();
    }
}