2012-03-24 34 views
22

çağrı yapılamıyor Oldukça basit bir şey yapmaya çalışıyorum, ama muhtemelen büyük olasılıkla belge aramak için yeterince iyi olmama sebebi ile işe yaramayacağım. Ben JS ayırmak çalışıyorum, çeşitli nedenlerden dolayıJavascript: Uncaught TypeError: 'addEventListener' null değerindeki 'null

<A title="Wolfram IP Calc" href="javascript:txt=prompt('Enter%20IP%20address,%20e.g.%2010.20.30.40/29','1.2.3.4/5');%20if(txt)%20window.open('http://www.wolframalpha.com/input/?i='+txt);void(O);">Compute!</A> 

ve bir pürüz çıktı budur:

Şöyle işleyen satır içi JS var.

Bana hata Uncaught TypeError: Cannot call method 'addEventListener' of null veriyor aşağıdaki test sayfası oluşturduk:

<HTML> <HEAD profile="http://www.w3.org/2005/10/profile"> <script type="text/javascript"> 
var compute = document.getElementById('compute'); 
compute.addEventListener('click', computeThatThing, false); 

function computeThatThing() { 
    txt=prompt('Enter%20IP%20address,%20e.g.%2010.20.30.40/29','1.2.3.4/5'); 
    if(txt) { 
     window.open('http://www.wolframalpha.com/input/?i='+txt); 
    } 
} 
</script></HEAD> 
<BODY> 
<A title="Wolfram IP Calc" id="compute" href="javascript:void(O);">Test</A> 
</BODY> 
</HTML> 

Böyle bir probleme noktaları addEventListener çalışamaz olduğunu bulmak mümkün olduğum tek şey, Ben neyi işaret için şimdiden

<img id="compute" src="http://products.wolframalpha.com/images/products/products-wa.png" /> 

Teşekkür: <A> ile değil (bazı görüntülerde bu dökmek için gidiyorum ince bana uygun olan) <IMG> işlemesi gerektiğini, bu yüzden boşuna aşağıdaki ekleyerek çalıştı Yanlış yapıyorum. Muhtemelen göze çarpan bir şekilde açıktır, ancak JS ile sıfıra yakın deneyime sahibim ve şimdiye kadar ihtiyaç duyduğumda çoğunlukla kargo ticareti ile gittim.

+0

Kullanım jQuery. $ (document) .ready (function() {}); – PhillipKregg

+1

@PhillipKregg, Projeme JQuery ekleyerek gereksiz karmaşıklık ve yükleme süreleri ekleyeceğini hissediyorum. – Jan

+0

@PhillipKregg Bu, base64 kodlu resimler de dahil olmak üzere tek bir dosyada her şeyin bulunduğu bir proje için özel bir bağımlılığa sahip değildir. – Jan

cevap

54

Kodunuz içindedir <head> => çalıştırır elemanları ... MDN vaadi olarak, yani document.getElementById('compute'); döner boş

element = document.getElementById(id);
element is a reference to an Element object, or null if an element with the specified ID is not in the document.

MDN

Çözümler işlenir önce:

  1. Komut dosyalarını sayfanın altına yerleştirin.
  2. Yükleme olayında ek kodunu arayın.
  3. jQuery kitaplığını ve DOM hazır olayını kullanın.

jQuery ready olay nedir?

While JavaScript provides the load event for executing code when a page is rendered, this event does not get triggered until all assets such as images have been completely received. In most cases, the script can be run as soon as the DOM hierarchy has been fully constructed. The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers...
...

readydocs

+1

Teşekkürler gdoron'! Çözüm 1 doğrudan sopası çalıştı. Bu kadar basit ve neredeyse sezgisel olduğunu gerçekten şaşırdım. Şimdi üretim kodumu kırmak için! :) – Jan

+0

Aynı problemle karşı karşıyayım ve morris şemasını canlandırıyorum. ve bütün bunları yaptım ve hala umudum yok. – Abhinav

İlgili konular