Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Nodi non creati via javascript non riconosciuti

    Salve a tutti,
    cercando di realizzare una funzione javascript per scambiare i valori di due campi input successivi ho realizzato questa funzione

    function upBiografia(campo){
    var fratello= campo.parentNode.previousSibling;
    if(null != fratello) {
    var tmp= fratello.firstChild.value;
    fratello.firstChild.value= campo.parentNode.firstChild.value;
    campo.parentNode.firstChild.value= tmp;
    }
    }

    che effettivamente funziona ma solo sugli elementi creati attraverso javascript con quest'altra funzione

    function addBiografia(id){
    campi = document.createElement('div');
    document.getElementById(id).appendChild(campi);
    campi.innerHTML="<input class=\"tappabiografica\" name=\"tappabiografica[]\" type=\"text\" value=\"\"><a class=\"biosu\" href=\"#\" title=\"Sposta su\" onclick=\"upBiografia(this); return false;\"></a><a class=\"biogiu\" href=\"#\" title=\"Sposta giù\"></a><a class=\"biodel\" href=\"#\" title=\"Elimina\"></a><div class=\"clear\">";
    window.scrollBy(0,50);
    }

    mentre non mi riconosce il campo iniziale che io ho inserito a mano

    <div>
    <input class="tappabiografica" name="tappabiografica[]" value="" type="text"><div class="clear"></div>
    </div>

    Posso ovviamente realizzare la funzione in altri modi, tuttavia mi sembra strano che non vengano riconosciuti quei nodi non creati via javascript. L'errore che mi dà la console è:
    Errore: fratello.firstChild is null

  2. #2
    mmm devi considerare che se hai questo HTML:

    codice:
    <div id="MyID">
       <p class="MyParagraph">
       </p>
       <input type="button" onclick="alert(this.previousSibling.className)" />
    </div>
    Al click sul bottone non è affatto detto che di faccia l'alert con "MyParagraph" anzi, sicuramente non te lo fa, questo perché tra i due ci sono degli spazi, tab, testo, che le specifiche DOM indicano come TextNode.

    a tutti gli effetti la struttura che vedi è composta da
    codice:
    [ElementNode tagName="div" id="MyID"]
    [TextNode value="   "][ElementNode tagName="p class="MyParagraph"]
    [TextNode value="   "][/p]
    [TextNode value="   "][ElementNode tagName="input type="button" onclick="alert(this.previousSibling.className)" /]
    [/div]
    Quindi per ottenere il paragraph dall'input devi fare input.previousSibling.previousSibling, comunque questo non è il metodo più sicuro, il modo migliore è:

    codice:
    //Ottiene l'elemento HTML precedente
    function getPrevous(elem){
       for(var c = elem.previousSibling; c != null; c = c.previousSibling){
          if(c.nodeType == 1){ //nodeType == 1 >> ElementNode
             return c;
          }
       }
       return null;
    }
    //Ottiene l'Elemento HTML successivo
    function getNext(elem){
       for(var c = elem.nextSibling; c != null; c = c.nextSibling){
          if(c.nodeType == 1){ //nodeType == 1 >> ElementNode
             return c;
          }
       }
       return null;
    }
    Con queste funzioni sei sicuro di ottenere o l'elemento inderessato o null.
    I DON'T Double Click!

  3. #3
    Grazie mille per la veloce risposta, sei stato di grande aiuto!!
    Avevo già sentito parlare di questo problema dei nodi di testo, tuttavia non capisco perchè dovrebbe trovarmene anche se io, come avevo provato a fare, scrivo tutto senza lasciare alcuno spazio.
    Comunque provo con il tuo metodo e vedo subito se funziona.

    Edit: funziona perfettamente!! Grazie mille!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.