Good afternoon, I'm trying to find a container that can disable all the elements inside it, not just input's, but also image and other elements that do not have the disabled property ... I would not like to hide the container, but disable it ... do you know that there is a container that I can do it? thank you
$(document).ready(function () {
$('#btnHabilitar').click(function () {
$("#menu").prop("disabled", false);
});
$('#btnDesabilitar').click(function () {
$("#menu").prop("disabled", true);
});
$(document).mouseup(function (e) {
var container = $("#menu");
if (!container.is(e.target) && container.has(e.target).length === 0) {
$("#menu").prop("disabled", true);
}
});
$('#img1').click(function () {
alert('clicou imagem');
});
});
<fieldset id="menu" >
<div class="container-fluid" >
<div class="row">
<input type="button" class="col-md-2 btn btn-primary" id="botao1" value="botao 1" />
<input type="button" class="col-md-2 btn btn-primary" id="botao2" value="botao 2" />
<input type="button" class="col-md-2 btn btn-primary" id="botao3" value="botao 3" />
<input type="button" class="col-md-2 btn btn-primary" id="botao4" value="botao 4" />
<input type="button" class="col-md-2 btn btn-primary" id="botao5" value="botao 5" />
<input type="button" class="col-md-2 btn btn-primary" id="botao6" value="botao 6" />
</div>
<div class="row">
<img src="img/css3.png" id="img1" style="width:200px; height:200px;"/>
<img src="img/bootstrap.png" style="width:200px; height:200px;" />
<img src="img/html.png" style="width:200px; height:200px;" />
</div>
</div>
</fieldset>