Risposte:
Il modo corretto per farlo è usare show
e hide
:
$('#id').hide();
$('#id').show();
Un modo alternativo è quello di utilizzare il metodo CSS jQuery :
$("#id").css("display", "none");
$("#id").css("display", "block");
$(".class").css("display", "none");
$('#id').css('display', 'none');
, ma non ha funzionato. Tuttavia, l'utilizzo $('#id').css('color', 'red');
funziona. Non sono sicuro del perché, però. Qualcuno ha qualche idea? Grazie in anticipo.
Esistono diversi modi per raggiungere questo obiettivo, ognuno con il suo scopo previsto.
1. ) Usare in linea semplicemente assegnando a un elemento un elenco di cose da fare
$('#ele_id').css('display', 'block').animate(....
$('#ele_id').css('display', 'none').animate(....
2. ) Da utilizzare durante l'impostazione di più proprietà CSS
$('#ele_id').css({
display: 'none'
height: 100px,
width: 100px
});
$('#ele_id').css({
display: 'block'
height: 100px,
width: 100px
});
3. ) Chiamare dinamicamente a comando
$('#ele_id').show();
$('#ele_id').hide();
4 ) Per alternare dinamicamente tra blocco e nessuno, se è un div
$ ( '# Ele_id') a ginocchiera ().;
Se la visualizzazione del div è bloccata per impostazione predefinita, puoi semplicemente usare .show()
e .hide()
, o anche più semplice, .toggle()
alternare tra visibilità.
Per nascondere:
$("#id").css("display", "none");
Per lo spettacolo:
$("#id").css("display", "");
Modo semplice:
function displayChange(){
$(content_id).click(function(){
$(elem_id).toggle();}
)}
(function($){
$.fn.displayChange = function(fn){
$this = $(this);
var state = {};
state.old = $this.css('display');
var intervalID = setInterval(function(){
if( $this.css('display') != state.old ){
state.change = $this.css('display');
fn(state);
state.old = $this.css('display');
}
}, 100);
}
$(function(){
var tag = $('#content');
tag.displayChange(function(obj){
console.log(obj);
});
})
})(jQuery);
Nel caso in cui desideri nascondere e mostrare un elemento, a seconda che sia già visibile o meno, puoi usare toggle invece di .hide()
e.show()
$('elem').toggle();
Nel mio caso stavo facendo mostrare / nascondere elementi di una forma in base al fatto che un elemento di input fosse vuoto o meno, in modo che quando si nascondevano gli elementi che seguivano quelli nascosti si riposizionava occupando il suo spazio era necessario fare un float: left dell'elemento di tale elemento. Anche usando un plugin come dipende da On era necessario usare float.
Usa questo:
$("#id").(":display").val("block");
O:
$("#id").(":display").val("none");
<style> #choosepath { display: none; } </style> <script> $(document).ready(function () { $('#btn_journey').click(function () { alert("button click"); $('#choosepath').css({"display":"normal"}); }); }); </script> </head> <body> <a href="#" class="btn btn-primary btn-lg" id="btn_journey">Start your journey</a> <div class="col-lg-3 col-md-6 mb-4" id="choosepath"> </div> </body></html>
Uso:
$(#id/.class).show()
$(#id/.class).hide()
Questo è il modo migliore.
#id
usato per gli id che dire se voglio usareclass
?