jQuery-Schaltflächen mit derselben Klasse, Wert von Schaltfläche abrufen

Question

Ich habe ein PHP-Skript, das Schaltflächen für jeden Inhaltszeitplan generiert. Die HTML-Schaltfläche des Skript-Echos mit dem gleichen Namen, der gleichen Klasse und ID, jedoch werden die Werte basierend auf einer Variablen festgelegt.

In jQuery ich den Knopf auf seiner Klasse basiert erklärt haben, so etwas wie

$('.save').button(); 

Allerdings, wenn ich auf eine Schaltfläche klicken, gibt es immer den Wert der ersten Taste „1“, auch wenn ich auf die 3. Schaltfläche oder die 20. Schaltfläche.

jQuery

$('.save').unbind().click(function() {  
    $.post('create.php', {'val' : $('.save').val()}, function(data){  
     alert($('.save').val()); // Always alerts "1" regardless of button pressed.  
     }); 
}); 

PHP

$ctr = 1; 
foreach($GLOBALS['conflict_schedule'] as $key => $value) { 
    $html = ' 

    <div style="float:right;"> 
    <button class="save" name="save" value="' . $ctr . '" id="save">Save</button> 
    </div> 

    echo $html; 
    $ctr++; 
} 

Answer 1

Statt Wieder Auswahl des $('.save') -Glied, einfach $(this) verwenden, die auf das Element verweist geklickt wird:

$('.save').unbind().click(function() { 
    var clicked = $(this); 

    $.post('create.php', {'val' : clicked.val()}, function(data){ 
     alert(clicked.val()); 
    }); 
}); 

Answer 2

Für mich ist die richtige Antwort scheint Ihren PHP zu sein zu ändern einzigartige IDs zu erzeugen und nicht die gleiche ID auf allen Tasten verwenden:

$ctr = 1; 
foreach($GLOBALS['conflict_schedule'] as $key => $value) { 
    $html = ' 

    <div style="float:right;"> 
    <button class="save" name="save" value="'.$ctr.'" id="save_'.$ctr.'">Save</button> 
    </div> 

    echo $html; 
    $ctr++; 
} 

und bei Verwendung von JQ 1.7+:

$('.save').on('click' create); //to bind 

$('.save').off('click' create); //to unbind 

function create(e) { 
    $.post('create.php', {'val' : e.target.value}, function(data){  
     alert(e.target.value); 
    }); 
}