2013-06-25 21 views
5

Widziałem wiele wątków związanych z tytułem mojego pytania.Przekaż identyfikator elementu funkcji JavaScript

Oto kody HTML:

<button id="button1" class="MetroBtn" onClick="myFunc(this.id);">Btn1</button> 
<button id="button2" class="MetroBtn" onClick="myFunc(this.id);">Btn2</button> 
<button id="button3" class="MetroBtn" onClick="myFunc(this.id);">Btn3</button> 
<button id="button4" class="MetroBtn" onClick="myFunc(this.id);">Btn4</button> 

I bardzo prosta funkcja JS jest tutaj:

function myFunc(id){ 
     alert(id); 
} 

można zobaczyć w JsFiddle.

Problemem jest:

nie mam pojęcia, może nie przechodzi this.id do myFunc funkcji, lub jakiegoś innego problemu.

Na czym polega problem?

Każda pomoc zostanie doceniona.

+3

Wziąłem swoje skrzypce i zmienił 1 rzecz, to działało: http://jsfiddle.net/h7kRt/2/ – MisterBla

Odpowiedz

7

W jsFiddle domyślnie kod należy wpisać w bloku skryptu jest owinięty w funkcji zawartej w dniu window.onload:

<script type='text/javascript'>//<![CDATA[ 
    window.onload = function() { 
     function myFunc(id){ 
      alert(id);  
     } 
    } 
//]]> 
</script> 

Z tego powodu czynność myFunc nie jest w zasięgu globalnym, tak nie jest dostępne dla przycisków html. Zmieniając opcję No-wrap in <head> jak Sergio sugeruje Twój kod nie jest owinięty:

<script type='text/javascript'>//<![CDATA[ 
    function myFunc(id){ 
     alert(id);  
    } 
//]]> 
</script> 

a więc funkcja jest w zasięgu globalnym i dostępne dla przycisków html.

6

Sprawdź to: http://jsfiddle.net/h7kRt/1/,

należy zmienić w jsfiddle na lewym górnym rogu do No-wrap in <head>

Twój kod wygląda dobrze i będzie działać wewnątrz normalnej stronie. W jsfiddle twoja funkcja została zdefiniowana wewnątrz modułu obsługi ładunku i dlatego ma inny zakres. Po przejściu na No-wrap masz go w zasięgu globalnym i możesz go używać zgodnie z oczekiwaniami.

+0

Tak, ale byłoby miło, aby wyjaśnić, dlaczego * * to działa ... – lonesomeday

+1

Również miło byłoby włączyć tutaj kod, aby nie polegać na stronie trzeciej. – nothrow

+1

@Yossarian, jaki kod? Nie zmieniłem żadnego kodu, on po prostu zapomniał umieścić "No-wrap" w jsfiddle. – Sergio

3

to będzie działać:

<!DOCTYPE HTML> 
<html> 
    <head> 
     <script type="text/javascript"> 
      function myFunc(id) 
      { 
       alert(id); 
      } 
     </script> 
    </head> 

    <body> 
     <button id="button1" class="MetroBtn" onClick="myFunc(this.id);">Btn1</button> 
     <button id="button2" class="MetroBtn" onClick="myFunc(this.id);">Btn2</button> 
     <button id="button3" class="MetroBtn" onClick="myFunc(this.id);">Btn3</button> 
     <button id="button4" class="MetroBtn" onClick="myFunc(this.id);">Btn4</button> 
    </body> 
</html> 
0

Problemem dla mnie było tak proste, jak po prostu nie znając dobrze Javascript. Próbowałem przekazać nazwę id, używając podwójnych cudzysłowów, kiedy powinienem używać singla. I działało dobrze.

To działało:

validateSelectizeDropdown('#PartCondition') 

to nie:

validateSelectizeDropdown("#PartCondition") 

a funkcja:

function validateSelectizeDropdown(name) { 
    if ($(name).val() === "") { 
     //do something 
    } 
} 
0

można to wykorzystać.

<html> 
    <head> 
     <title>Demo</title> 
     <script> 
      function passBtnID(id) { 
       alert("You Pressed: " + id); 
      } 
     </script> 
    </head> 
    <body> 
     <button id="mybtn1" onclick="passBtnID('mybtn1')">Press me</button><br><br> 
     <button id="mybtn2" onclick="passBtnID('mybtn2')">Press me</button> 
    </body> 
</html> 
Powiązane problemy