jquery bind κλικ μετά από κλήση AJAX

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
sibas
Honorary Member
Δημοσιεύσεις: 1853
Εγγραφή: 21 Φεβ 2003 01:21
Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
Επικοινωνία:

jquery bind κλικ μετά από κλήση AJAX

Δημοσίευση από sibas » 23 Απρ 2015 15:43

Γεια χαρά
έχω το εξής πρόβλημα, καλώ ένα button μέσω ajax post πχ

Κώδικας: Επιλογή όλων

jQuery.ajax({
	type: "POST", 
	url: "example.php", 
	data:'data='+ data, 
	cache:false, 
	success:function(results){
	$('#data').html(results);
	}
});
example.php echo's

Κώδικας: Επιλογή όλων

<button class="button" data-id="13">Go to</button>
μέχρι εδώ όλα καλά και όλα λειτουργούν
αλλά χρειάζομαι όταν κάνουν κλικ στο button να εκτελείτε , πχ

Κώδικας: Επιλογή όλων

$&#40;".button"&#41;.bind&#40;"click", function&#40;e&#41; &#123;
var dataId= $&#40;this&#41;.attr&#40;'data-id'&#41;;
alert&#40;dataId&#41;;
&#125;&#41;;

το παραπάνω bind λειτουργεί μια χαρά όταν προσθέτω το button σαν κανονική html!
Αλλά δεν λειτουργεί όταν παρουσιάζεται σαν innerhtml από το ajax..

Υπάρχει κάποια ιδέα?

Άβαταρ μέλους
burnmind
Script Master
Δημοσιεύσεις: 954
Εγγραφή: 26 Σεπ 2009 02:14
Τοποθεσία: UK
Επικοινωνία:

jquery bind κλικ μετά από κλήση AJAX

Δημοσίευση από burnmind » 23 Απρ 2015 15:55

Η bind κάνει attach τον event handler σε elements που υπάρχουν ήδη στο DOM, οπότε σωστά δεν καλύπτει το element που προσθέτεις μετά. Αν χρησιμοποιήσεις την on θα κάνεις τη δουλεια σου.

Άρα, αλλαξε το:

Κώδικας: Επιλογή όλων

$&#40;".button"&#41;.bind&#40;"click", function&#40;e&#41; &#123;
var dataId= $&#40;this&#41;.attr&#40;'data-id'&#41;;
alert&#40;dataId&#41;;
&#125;&#41;;
σε κάτι του στυλ:

Κώδικας: Επιλογή όλων

$&#40;document&#41;.on&#40;"click", 'button.button', function&#40;e&#41; &#123;
var dataId= $&#40;this&#41;.attr&#40;'data-id'&#41;;
alert&#40;dataId&#41;;
&#125;&#41;;
Μπορείς να κάνεις attach τον handler σε οποιοδήποτε parent element εκτός του document που έχω βάλει στο παράδειγμα (το οποίο δε δοκίμασα, οπότε ίσως κάτι να μη δουλεύει σωστά, αλλά πιάνεις τη λογική).

sibas
Honorary Member
Δημοσιεύσεις: 1853
Εγγραφή: 21 Φεβ 2003 01:21
Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
Επικοινωνία:

jquery bind κλικ μετά από κλήση AJAX

Δημοσίευση από sibas » 23 Απρ 2015 16:08

Με πρόλαβες!! όντως το παρακάτω κάνει όλη την εργασία!

Κώδικας: Επιλογή όλων

$&#40;document&#41;.on&#40;"click", ".button", function&#40;&#41; &#123;
Thanks :lol:

Άβαταρ μέλους
giannis17
Honorary Member
Δημοσιεύσεις: 1215
Εγγραφή: 06 Ιαν 2005 19:50
Τοποθεσία: Παγκράτι - Αθήνα
Επικοινωνία:

jquery bind κλικ μετά από κλήση AJAX

Δημοσίευση από giannis17 » 26 Απρ 2015 13:20

Άλλη δημοφιλής λύση είναι μέσα στο ajax success να περιλαμβάνεις κάθε φορά και το bind script και προσωπικά αυτή προτιμώ
"There is only one problem with common sense; it’s not very common."
&#8211; Milt Bryce

sibas
Honorary Member
Δημοσιεύσεις: 1853
Εγγραφή: 21 Φεβ 2003 01:21
Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
Επικοινωνία:

jquery bind κλικ μετά από κλήση AJAX

Δημοσίευση από sibas » 27 Απρ 2015 13:01

@giannis17 δεν είναι καθόλου άσχημη ιδέα, θα το τσεκάρω!

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες