Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Jednorazowe wywołanie funkcji onClick
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
ZenekN
Witam, potrzebuję wykonać funkcję onClick w całym wierszu w polach input, z tym że jeśli klikniemy na dowolne pole z danego wiersza aby funkcja dodała tylko jeden wiersz pod spodem.
U mnie wygląda to w ten sposób że gdy klikam w pole kod towaru prawidłowo pojawia się kolejny wiersz tabeli, natomiast gdy przechodzę w tym samym wierszu do pola ilość lub cena nie chcę aby funkcja dodawajka generowała kolejne wiersze z polami.

Proszę o wykasowanie tego tematu:
  1. http://forum.php.pl/Jednorazowe_wywolanie_funkcji_z_zdarzenia_onClick_t230734.html







  1. <tr>
  2. <td>
  3. <code>1</code>
  4. </td>
  5. <td><input id="form-custom" onClick="dodawajka()" type="text" class="input-sm form-control"></td>
  6. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  7. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  8. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  9. </tr>


  1.  
  2.  
  3.  
  4. function dodawajka(){
  5.  
  6. var content = $("#faktura-body");
  7. var i = $("#faktura-body tr").size() +1;
  8.  
  9. $("<tr onClick=\"dodawajka()\"><td><code>1</code></td><td ><input id=\"form-custom\" type=\"text\" class=\"input-sm form-control\"></td><td><input id=\"form-custom\" type=\"text\" class=\"input-sm form-control\"></td><td><input id=\"form-custom\" type=\"text\" class=\"input-sm form-control\"></td><td><input id=\"form-custom\" type=\"text\" class=\"input-sm form-control\"></td></tr>").appendTo(content);
  10.  
  11. i++;
  12. return false;







}
kamil4u
Nie wiem do końca o co chodzi, ale kieruję się tytułem.

Zrób tak, że wywołujesz funkcję onlick po czym w tej samej funkcji kasujesz wywołanie. Przykład:
Kod
<script>
function funkcja( el ){
alert("Można kliknąć tylko raz :) ");
el.onclick = null;
}
</script>

<input type="button" value="test1" onclick="funkcja(this);">
<input type="button" value="test2" onclick="funkcja(this);">
<input type="button" value="test3" onclick="funkcja(this);">
<input type="button" value="test4" onclick="funkcja(this);">
ZenekN
  1. <tr onClick="funkcja(this)>
  2. <td>
  3. <code>1</code>
  4. </td>
  5. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  6. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  7. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  8. <td><input id="form-custom" type="text" class="input-sm form-control"></td>
  9. </tr>


Swietnie!!! Działa tak jak chciałem zastosowałem onClik dla wiersza
Możesz mi powiedzieć co daje wartość this ? w onClick funkcja ?

I skąd parser wie że zdarzenie onClick już było raz wywołane i więcej nie można wywoływać ?
kamil4u
Mogę. Generalnie całość masz źle. Nie miesza się HTML z JS. W JS zdarzenia( np. kliknięcie ) możesz dodawać na kilka sposobów. Najlepiej poczytaj na ten temat np. : http://webhelp.pl/artykuly/obsluga-zdarzen-w-przegladarkach/ - tu opisany poprawny sposób dodawania zdarzeń.

Ale wróćmy do Twojego kodu albo lepiej do mojego.

Wraz z kliknięciem przekazujemy parametr this. this oznacza konkretny element. Czyli klikając na "test1" this wskazuje na <input type="button" value="test1" onclick="funkcja(this);">, a klikając na test3 w this dostajemy <input type="button" value="test3" onclick="funkcja(this);">

Teraz w naszej funkcji konkretny element mamy pod zmienną el. Teraz warto, żebyś poczytał o DOM. W skrócie chodzi o to, że za pomocą DOM możemy odczytywać, zmieniać wszystkie parametry elementu np. jak wewnątrz funkcji dasz:
alert( el.value ); to zostanie wyświetlona wartość HTML-owego pola value. Gdy dasz el.value = "nowa wartość"; to np. z test1 zmieni się wartość pola value na nowa wartość.

To samo można robić z onclick. Napisaliśmy w kodzie el.onclick = null; oznacz to tyle, że zmieniamy parametr klikniętego elementu na onclick="", bo null to nic. Czyli usuwamy pierwotne zdarzenie kliknięcia.

W razie czego pytaj to może napiszę coś więcej.

Pozdrawiam
ZenekN
A skąd parser wie że już raz wywołaliśmy funkcję ?
kamil4u
Nie wie. Działa to tak:
1. Do jakiegoś elementu mamy przypisaną funkcję na zdarzenie kliknięcia
2. Klikamy na element, więc wywołuje się funkcja
3. funkcja wyświetla alert i usuwa zdarzenie kliknięcia
4. Gdy następnym razem klikamy na element nic się nie dzieje, bo już usunęliśmy zdarzenie kliknięcia na tym elemencie
ZenekN
Dzięki ci świetna fachowa rada!
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.