2010-10-30 12 views
10

Wywołuję funkcję w samym elemencie za pomocą atrybutu onclick, ponieważ potrzebuję php, aby dynamicznie podać wartość w jednym z parametrów funkcji. Kiedy próbuję odwołać się do elementu wywołującego w funkcji przez "$ (this)", kończy się odniesieniem do całego okna, a nie do elementu. Jak to naprawić?Jquery: Wybierz element, który wywołał funkcję

+2

To jest dobre pytanie i chociaż dostarczone odpowiedzi sugerują pewne obejścia, żadne z nich nie odpowiada na pierwotne pytanie. Chciałbym również poznać odpowiedź. Dlaczego dostaje okno zamiast $ (this) zamiast klikniętego elementu? –

Odpowiedz

6

Wątpię, czy rzeczywiście musisz użyć wbudowanego atrybutu onclick. Możesz przechowywać dane w elemencie na wiele różnych sposobów. Trudno powiedzieć dokładnie, jak byś to zrobił, nie wiedząc, jaki parametr musisz przekazać, ale podam kilka przykładów.

Najbardziej elastyczny będzie prawdopodobnie w data- atrybut:

<a href="#" id="subject" data-type="fiction">Text</a> 

Następnie można uzyskać dostęp do informacji w następujący sposób:

$(document).ready(function(){ 
    $('#subject').click(function(){ 
     $type = $(this).data('type'); // this works as of jQuery 1.4.3, otherwise $(this).attr('data-type'); 

     // do your handling here, using $type 
    }); 
}); 

Można to zrobić także za pomocą klas, tagi skryptu które tworzą globalne zmienne, wszystkie rodzaje metod. Te prawie na pewno będą lepsze niż umieszczanie uchwytów jQuery w atrybutach onclick.

19

Spróbuj wysłać elementu jako parametr do funkcji tak:

<input type="text" onclick="myfunction(this);"></input> 

czynność powinna być:

<script> 
    function myfunction(currentElement){ 
    // ... 
    } 
</script> 
4

Rozwiązaniem jest, aby zapisać wartość dynamiczną w atrybutu niestandardowego nie obsługuje onclick. Specyfikacja HTML definiuje dowolny atrybut zaczynający się od "data-" jako dane niestandardowe używane dokładnie dla takich rzeczy, i jest zgodny ze specyfikacją, więc zostanie sprawdzony. Więc można zrobić coś takiego (z użyciem PHP na przykład dostosować odpowiednio):

<input type="text" id="some-input" data-some-dynamic="<?php echo $something; ?>"> 

następnie pobrać w javascript tak:

$(document).ready(function() { 
    $('#some-input').click(function() { 
    // $(this) -- is the input element 
    // $(this).attr('some-dynamic-attribute') -- contains the dynamic data you need 
    }); 
}); 

Myślę, że ta metoda jest lepsza niż przy użyciu ładowarki atrybutów jak onclick = "", proste, ponieważ jest bardziej solidne z punktu widzenia projektu; rozdzielenie obaw i tak dalej.

+0

Dzięki za dobrze przemyślaną odpowiedź. Chociaż niekoniecznie to, czego potrzebowałem, to bardzo interesująca metoda. –

+0

Allen - ta odpowiedź jest taka sama jak ta, którą dostałeś od lonesomeday wraz z alternatywą. –

+0

Ta odpowiedź miała początkowo dwie możliwości, ale ponieważ HTML5 jest teraz obsługiwany przez wszystkie nowoczesne przeglądarki, zaktualizowałem odpowiedź, aby zawierała tylko rozwiązanie "data-X". –

Powiązane problemy