$(()=>{
$("#c").click(function loop(event){
$("#a").show(1000).submit(function(event){
if ($("#b").val() === "hello"){
$("#a").hide(1000);
}
else{
alert($("#b").val() + " was typed!");
}
});
});
}); #a{
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="a"> name : <input type="name" id="b" value="type 'hello' to hide!"></form>
<button id="c">do it!</button>In the above snippet I don't want the input box to disappear from screen when anything other than hello is typed! It should display the message $("#b").val() + " was typed!" but shouldn't hide.
Hope this helps.
It was not actually hidden, rather the DOM itself was removed.
$(()=>{
$("#c").click(function loop(event){
$("#a").show(1000).submit(function(event){
event.preventDefault();
if ($("#b").val() === "hello"){
$("#a").hide(1000);
}
else{
alert($("#b").val() + " was typed!");
}
});
});
}); #a{
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="a"> name : <input type="name" id="b" value="type 'hello' to hide!"></form>
<button id="c">do it!</button>