Usuário com melhor resposta
appendchild

Pergunta
-
pessoal, bom dia!
estou tendo um problema com a criação de um menu em javascript.. fazendo alguns testes, eu consegui localizar o local onde o erro ocorre. O problema é que esse erro não ocorre no IE, somente no Chrome e no FireFox..
o erro que acontece é o seguinte:
cannot call method appendchild of null
li aqui na net, sobre o script está sendo executado antes do restante do código, alterei a posição do script e ele passou a não encontrar a minha função, em todos os navegadores...
o erro ocorre na linha em negrito.. nada mais executa depois dela..
this.draw = function() { if (headerText == null) { headerText = document.createTextNode("Menu"); header.appendChild(headerText); } menu.appendChild(body); parent.appendChild(menu); obj.heightLine(); if (st) obj.state(); };
alguém faz ideia do que pode está acontecendo?
Respostas
-
Bom como você mesmo postou recentimente , veja que na chamada quando você especifica o "mm" veja se a tag que tem esse nome também tem o id igual
ou seja se for uma tag div veja se está assim <div id="mm" name="mm"> </div> pois se tiver apenas <div name="mm"></div> somente no IE será reconhecido que essa tag possui um nome e id que servirá para o getElementById , já para outros navegadores não irá reconhecer apenas se tiver id na tag ai sim será feito o reconhecimento. Veja isso deixe o mesmo no nome do name também para o id.
Davi Murilo Referência Principal : Jesus que ilumina minha mente.
Referência Profissonal : http://www.tidm.com.br- Marcado como Resposta kngipa terça-feira, 2 de abril de 2013 14:33
-
aaahhhhhhhhhhhh que lindo!
o chrome é "casesentive" tbm né!!! :)
troquei de Menu para menu e ai deu! :)
obrigada! seu comentário me ajudou a analisar em questão dos ids..
Todas as Respostas
-
Qual é a origem do menu , pois o menu já aparece dando um appendChild , mas da onde ele vem tem como mostrar o codigo mais completo para identificarmos melhor .
Davi Murilo Referência Principal : Jesus que ilumina minha mente.
Referência Profissonal : http://www.tidm.com.br -
é um pouco grande.. mas tem sim... é a função em negrito que da pau..
eu tenho esse código e tenho a chamada dele em outra parte do código..não foi eu que fiz, e eu não domino js...
a linha que marquei no chrome está retornando null
<script type="text/javascript"> //<![CDATA[ jQuery.noConflict(); MenuWin = function(p, id, s) { var obj = this; // referência ao próprio objeto MenuWin var st = (typeof s != 'undefined' && s != null) ? s : false; var parent = document.getElementById(p); // objeto que será o container do menu var menu = document.createElement("div"); // o menu menu.setAttribute("id", id); menu.setAttribute((document.all) ? "className" : "class", "menuWin"); var header = document.createElement("span"); // cabeçalho do menu header.setAttribute((document.all) ? "className" : "class", "menuWin-header"); var headerText = null; var images = new Array(new Image(), new Image()); images[0].src = "Imagens/nav_up.gif"; images[1].src = "Imagens/nav_down.gif"; var arrow = document.createElement("img"); // imagem para retrair e extender o menu arrow.setAttribute("alt", ""); arrow.setAttribute("title", ""); arrow.setAttribute("src", images[0].src); arrow.onclick = function() { if (this.getAttribute("src").indexOf("up") > -1) { this.setAttribute("src", images[1].src); jQuery("#" + body.getAttribute("id")).animate({ height: "hide", opacity: "hide" }, "slow"); } else { this.setAttribute("src", images[0].src); jQuery("#" + body.getAttribute("id")).animate({ height: "show", opacity: "show" }, "slow"); } } var arrowContainer = document.createElement("span"); // container da imagem que retrai e extende o menu arrowContainer.setAttribute((document.all) ? "className" : "class", "menuWin-arrow"); arrowContainer.appendChild(arrow); menu.appendChild(arrowContainer); menu.appendChild(header); var body = document.createElement("ul"); // corpo do menu body.setAttribute("id", "menuWin-body-" + id); body.setAttribute((document.all) ? "className" : "class", "menuWin-body"); obj.state = function() { body.style.display = "none"; arrow.setAttribute("src", images[1].src); }; // função para setar o cabeçalho do menu this.setTitle = function(t) { headerText = document.createTextNode(t); header.appendChild(headerText); }; // função para setar os itens do menu // recebe como parâmetros o texto, o link, o target e a imagem do item this.setItens = function(t, a, tg, i) { var li = document.createElement("li"); var link = document.createElement("a"); var img = document.createElement("img"); var imgContainer = document.createElement("div"); if (i != null) { img.setAttribute("alt", ""); img.setAttribute("title", ""); img.setAttribute("src", i); imgContainer.appendChild(img); } link.appendChild(imgContainer); link.setAttribute("href", a); if (tg != null) link.setAttribute("target", tg); link.appendChild(document.createTextNode(t)); li.appendChild(link); body.appendChild(li); }; // esta função extende o container da image que retrai e extende o menu, // para manter alinhado o texto dos itens do menu. this.heightLine = function() { var linhas = body.getElementsByTagName("li"); for (i = 0; i < linhas.length; i++) { while (linhas[i].getElementsByTagName("div")[0].offsetHeight < linhas[i].offsetHeight) linhas[i].getElementsByTagName("div")[0].style.height = linhas[i].offsetHeight + "px"; } }; // função para inserir na tela o menu this.draw = function() { if (headerText == null) { headerText = document.createTextNode("Menu"); header.appendChild(headerText); } menu.appendChild(body); parent.appendChild(menu); obj.heightLine(); if (st) obj.state(); }; }; //]]> </script>
isso está dentro de uma div, o código acima é antes..
var nTodosSetores = new MenuWin("menu","mm"); nTodosSetores.setTitle("Ocorrências - Todos os Setores"); nTodosSetores.setItens("Pesquisar", "consulta_ocorrencias.aspx?StatusOcor=Aberta", null, "Imagens/Ocorrencia.gif"); nTodosSetores.setItens("Relatórios", "consulta_ocorrencias.aspx", null, "Imagens/Ocorrencia.gif"); nTodosSetores.draw(); document.write("<br />");
- Editado kngipa terça-feira, 2 de abril de 2013 14:14
-
Bom como você mesmo postou recentimente , veja que na chamada quando você especifica o "mm" veja se a tag que tem esse nome também tem o id igual
ou seja se for uma tag div veja se está assim <div id="mm" name="mm"> </div> pois se tiver apenas <div name="mm"></div> somente no IE será reconhecido que essa tag possui um nome e id que servirá para o getElementById , já para outros navegadores não irá reconhecer apenas se tiver id na tag ai sim será feito o reconhecimento. Veja isso deixe o mesmo no nome do name também para o id.
Davi Murilo Referência Principal : Jesus que ilumina minha mente.
Referência Profissonal : http://www.tidm.com.br- Marcado como Resposta kngipa terça-feira, 2 de abril de 2013 14:33
-
então Davi.. pelo que estou entendendo desse código, ele cria essa div nessas funções ai.. então acho que não tenho isso quando o código é executado.. eu tenho esse código:
onde me parece que vai montando essas divs.. eu tenho uma div menu, com id=menu.. mas não tem o name..<div id="Menu"> <script type="text/javascript"> //<![CDATA[ var nTodosSetores = new MenuWin("menu","mm"); nTodosSetores.setTitle("Ocorrências - Todos os Setores"); nTodosSetores.setItens("Pesquisar", "consulta_ocorrencias.aspx?StatusOcor=Aberta", null, "Imagens/Ocorrencia.gif"); // nTodosSetores.setItens("Relatórios", "consulta_ocorrencias.aspx", null, "Imagens/Ocorrencia.gif"); nTodosSetores.draw(); document.write("<br />");
OUTRAS INSTANCIAS DE MENUWIN.....
-
aaahhhhhhhhhhhh que lindo!
o chrome é "casesentive" tbm né!!! :)
troquei de Menu para menu e ai deu! :)
obrigada! seu comentário me ajudou a analisar em questão dos ids..