2010-01-22 2 views
6

Ich bin ein sehr neues jquery und habe Probleme beim Anrufen mehr als einer Instanz einer Funktion.jquery - Wie rufe ich dieselbe Funktion mit verschiedenen Element-ID-Tags auf?

Ich habe eine Funktion

$('#open_dialog').click(function(){ 
    $("#dialog").dialog("open"); 
     return false;  
}); 

diese Funktion i einen href Link mit einem id-Tag-Namen von open_dialog haben zu nennen. Offensichtlich funktioniert das großartig, wenn es der einzige Link auf der Seite ist, der auf die Funktion verweist (Eine Eins-zu-Eins-Beziehung). Allerdings möchte ich (Eine Viele-zu-Eins-Beziehung).

Ich habe eine Tabelle mit 25 Datensätzen und ich benötige für jeden meiner Datensätze einen Link, der die Funktion open_dialog aufrufen wird. Ich weiß, dass alle IDs nicht open_dialog heißen können, da sie eindeutig sein müssen die Funktion beim Übergeben des Wertes, von dem einer meiner 25 Datensätze die Funktion instanziiert.

Übrigens sind meine Datensätze dynamisch, daher ist $ ('# open_dialog, open_dialog2, open_dialog3, ...') nicht praktikabel.

Danke für

Antwort

11

statt mit einzigartigen IDs auf meinem Posten suchen Sie eine Klasse auf Ihre Elemente können dann benutzen Sie einfach

$('.classname').click(function() 
{ 
    // 'this' would reference the anchor that was clicked 
    $("#dialog").dialog("open"); 
     return false;  
}); 

auch, können Sie ein anderes Attribut auf den Anker hinzufügen, dh

<a href="#" class="classname" record="14">Record 14</a> 

dann in Ihrer Funktion können Sie

var record = $(this).attr("record"); 
haben

record enthalten würde jetzt 14.

+0

+1 - war gerade dabei, die gleiche Antwort zu übermitteln. – Buggabill

+0

Thaks John, das ist eine große Hilfe die einzige andere Sache ist, wie übergebe ich einen Parameter an die Funktion, zB wenn Datensatz Nummer 14 geklickt wurde ich brauche die open_dialog Funktion zu wissen, dass es über Datensatz 14 initialisiert wurde und keine anderen – Bazza

+1

Mein Vorschlag wäre zu Verwenden Sie die Element-ID dafür. Wenn Sie die Seite dynamisch erstellen, kann jedem Element zum Zeitpunkt der Erstellung eine eindeutige ID zugewiesen werden. Dann können Sie $ (this) .attr ("id") verwenden, um auf die ID des Elements zu verweisen, auf das geklickt wurde. – Buggabill

0

Sie Klasse statt id verwenden:

$('.open_dialog').click(function(){ 
    $('#dialog').dialog("open"); 
    return false; 
}); 
+0

Alle Elemente, die eine Klasse von 'open_dialog' haben, öffnen ein Dialogfeld. – Reigel

+0

Würde nicht funktionieren - $ (this) bezieht sich auf den Link, auf den geklickt wurde, was nicht der Dialog ist, den er öffnen möchte. Sie müssen .dialog auf der ID aufrufen, die den Inhalt des Dialogs enthält, in seinem Fall '#dialog'. – Parrots

0

Sie würden uns eine Klassenauswahl anstelle eines ID-Selektor.

die gleiche Klasse gelten für jeden Ihrer Links ... lets

<a class='openDialog' href='your link here'>Your text here</a> 

In jQuery 'Opendialog' sagen, dann würden Sie, was Sie dazu haben ändern ...

$('.openDialog').click(function(){ 
    $("#dialog").dialog("open"); 
    return false;  
}); 

Ich bin verwirrt, was Sie mit der "#dialog" ID obwohl referenzieren. Du hast nicht wirklich erklärt, was das oben ist ... oder zumindest habe ich es nicht verstanden, wenn du es getan hast.

Wenn es einen Wert aus dem Re-Cord-Set gab, das Sie in die onclick-Funktion übergeben mussten, konnten Sie die ID jedes Anker-Tags (vorausgesetzt, diese Werte sind eindeutig) als den Wert angeben, den Sie übergeben müssen. Referenz sie dann innerhalb des Codes wie so ... (ich die ID der Link in einer variablen rec_no unter dem Namen gespeichert haben ...

$('.openDialog').click(function(){ 
    var rec_no = $(this).attr("id"); 

    $("#dialog").dialog("open"); 
    return false;  
}); 
0

alle diese alle class Unsinn vergessen sonst spricht. Nur Verwenden Sie das, wenn Sie es unbedingt tun müssen (warum fügen Sie Bloat zum Markup hinzu, wenn es unnötig ist?). Da Sie angegeben haben, dass Ihre Links in einer Tabelle enthalten sind, können Sie alle Links innerhalb der Tabelle erhalten.

$("table a").click(function() { ... }); 

Oder wenn Ihre Tabelle hat eine ID drauf ...

$("#tableId a").click(function() { ... }); 

Erhalten Sie Ihr Rekord-ID innerhalb des Click-Ereignis ist zu einfach. Hängt davon ab, in welcher Spalte es ist in. Diese den Wert der ersten Spalte in der Tabelle (in dem Click-Ereignisse) alarmieren ...

var id = $(this).parent().siblings("td:eq(0)").text(); 
alert(id); 
0

Ich gehe davon aus der dialog Funktion wissen muss, welches Datensatz Sie‘ Bezug nehmend auf. Sie müssen eine Art ID für den Datensatz in Ihrem HTML ausgeben. Z.B.

<a class="open_dialog" id="record1"></a> 

Dann ändern die dialog Funktion der Aufzeichnung des ID als Argument zu akzeptieren, und übergeben Sie es wie folgt in:

$('.open_dialog').click(function(){ 
    $("#dialog").dialog("open", $(this).id); 
    return false; 
}); 

dialog eine Ihrer Funktionen oder etwas gebaut in jQuery?

Verwandte Themen