Nascondere tutti gli elementi con lo stesso nome della classe?

Sto cercando di nascondere elementi con lo stesso nome della classe (float_form), ma sto anche cercando di utilizzare lo script seguente per mostrare loro (tutti i float_form classe i div sono inizialmente nascoste). Ho guardato un sacco di jquery soluzioni, ma io non riesco a fare qualsiasi di loro lavorano per questo.

function show(a) {
    var e = document.getElementById(a);
    if (!e) 
        return true;

    if (e.style.display == "none") {
        e.style.display = "block"
    } else {
        e.style.display = "none"
    }
    return true;
}

Edit: Scusa se non sono stato chiaro, non ho intenzione di usare Jquery(e so che questo non è jquery). Sto cercando un modo per utilizzare javascript per riconoscere ripetuto nomi di classi che non sono in style= display:none; senza compromettere la mostra/nascondi ID elemento dal momento che c’è un loop con i div id come chiave. Il codice html per la div sembra di seguito, {item.ID} è un ciclo while.

 <div class="float_form" id="{item.ID}" style="display: none;"> 
  • Il codice ha zero jQuery. JavaScript non è jQuery!. Il codice mostrato seleziona un elemento con l’id, non dal nome della classe. Per questi ultimi, l’uso document.getElementsByClassName, e loop attraverso tutti gli elementi nell’elenco restituito.
  • Dobbiamo aggiungere jQuery tag? Ho risposto sia alla vaniglia js e jQuery.
  • Anche dopo la modifica è molto, molto chiaro quello che stai chiedendo\esigenza.
  • Beh, questo è fastidioso, molti si vogliono rendere il loro lavoro, e non passano il tempo a dire quello che vogliono. Suono come un aiuto vampiro per me
InformationsquelleAutor user1489970 | 2012-06-28



3 Replies
  1. 51

    javascript

    function toggle(className, displayState){
        var elements = document.getElementsByClassName(className)
    
        for (var i = 0; i < elements.length; i++){
            elements[i].style.display = displayState;
        }
    }
    
    toggle('float_form', 'block'); //Shows
    toggle('float_form', 'none'); //hides

    jQuery:

    $('.float_form').show(); //Shows
    $('.float_form').hide(); //hides
    • +1 ma purtroppo getElementsByClassName funziona solo su versioni più recenti dei browser.
    • Egli può usare jQuery, se vuole, o implementare getElementsByClassName se a lui piace. Egli deve mettere un sacco di sforzo in più, con le sue domande, io non evento di sapere se è veramente usando jQuery o non.
    • Beh, questo è fastidioso, molti si vogliono rendere il loro lavoro, e non passano il tempo a dire quello che vogliono. Suono come un aiuto vampiro per me
    • hai ragione, è frustrante, soprattutto quando fanno una domanda e ritorno la prossima settimana per verificare le risposte, mentre le persone che cercano di risolvere il problema di combattere contro l’altro.
  2. 7

    Se siete alla ricerca in jQuery, quindi è bene sapere che è possibile utilizzare un selettore di classe all’interno dei parametri di $ e chiamare il metodo .hide().

    $('.myClass').hide(); //all elements with the class myClass will hide.

    Ma se è un toggle che si sta cercando, è possibile utilizzare .toggle();

    Ma ecco il mio prendere su di una buona toggle senza utilizzando jQuery:

    function toggle( selector ) {
      var nodes = document.querySelectorAll( selector ),
          node,
          styleProperty = function(a, b) {
            return window.getComputedStyle ? window.getComputedStyle(a).getPropertyValue(b) : a.currentStyle[b];
          };
    
      [].forEach.call(nodes, function( a, b ) {
        node = a;
    
        node.style.display = styleProperty(node, 'display') === 'block' ? 'none' : 'block';
      });
    
    }
    
    toggle( '.myClass' );

    Demo qui (fare Clic su “Render” per l’esecuzione): http://jsbin.com/ofusad/2/edit#javascript,html

  3. 0

    Provare :

    function showClass(a){
     var e = [];
     var e = getElementsByClassName(a);
     for(i in e ){
        if(!e[i])return true;
    
        if(e[i].style.display=="none"){
           e[i].style.display="block"
        } else {
           e[i].style.display="none"
        }
     }
     return true;
    }

    demo : showClass("float_form");

    • Perché l’ID dell’elemento viene utilizzato per un ciclo di matrice, ho bisogno di tenere il getElementById. Ho provato ad utilizzare questo separatamente con un input nascosto pulsante, ma non ha funzionato neanche.
    • si tratta di una nuova funzione showClass(), basta tenere show() funzione che hai già, e aggiungere questo
    • L’ho fatto provare a utilizzare separatamente (e l’analisi di var e var f in funzione originale). Solo la funzione originale lavorato.

Lascia un commento