jQuery的傳遞不同的ID值包含變量

Question

首先計時器這裏的通用功能，第一次嘗試在PHP/jQuery的

此代碼工作：

$('#update1').click(function(){ 
    var name= $('#bandname-1').val(); 
    var bandid = $('#bid-1').val(); 
    var mbid = $('#mbid-1').val(); 
    $('#msg').text('updating...'); 
    $.post('func/update_bandname.php',{ 
     name: name, 
     bandid: bandid, 
     mbid: mbid 
    }, function(data){ 
     $('#msg1').text(data); 
    }); 
}); 

這是我的PHP： -snip

echo "<td>"; 
echo "<input type=\"text\" name=\"bandname-".$i."\" id=\"bandname-".$i."\" value=\"".$name ."\"/>&nbsp;"; 
echo "<input id=\"update".$i."\" type=\"button\" name=\"update".$i."\" value=\"update\" class=\"dp\"/>"; 
echo "<span id=\"msg".$i."\"></span><input type=hidden id=\"bid-".$i."\" value=\"".$_REQUEST[bid] ."\" name=bid-".$i."\" />"; 
echo "<input type=hidden id=\"mbid-".$i."\" value=\"".$bandid."\" name=mbid-".$i."\" />"; 
echo "</td>"; 
echo "</tr>"; 
$i++; 

的DB returs很多的記錄到這個表中，我創建了5個功能UPDATE1，UPDATE2等

有沒有辦法修改我的jquery，將不同​​的id值傳遞給一個函數？而不是一遍又一遍地複製功能？

感謝

Answer 1

指定一個共同的類和屬性data-每個元素：

PHP：

echo '<input class="updatebutton dp" data-idnum="'.$i.'" id="update'.$i.'" type="button" name="update'.$i.'" value="update">'; 

JS：

$('.updatebutton').click(function() { 
    var id = $(this).data('idnum'), 
     name= $('#bandname-'+id).val(), 
     bandid = $('#bid-'+id).val(), 
     mbid = $('#mbid-'+id).val(); 
    $('#msg').text('updating...'); 
    $.post('func/update_bandname.php', { 
      name: name, 
      bandid: bandid , 
      mbid:mbid 
    }, function(data) { 
      $('#msg'+id).text(data); 
    }); 
}); 

Answer 2

可以使用attribute starts with selector：

$('input[id^=update]').click(function() { 
    var id = this.id.match(/\d+/g).join(''); 
    var name= $('#bandname-'+id).val(); 
    var bandid = $('#bid-'+id).val(); 
    var mbid = $('#mbid-'+id).val(); 
    $('#msg').text('updating...'); 
    $.post('func/update_bandname.php', { 
      name: name, 
      bandid: bandid , 
      mbid:mbid 
    }, function(data) { 
      $('#msg'+id).text(data); 
    }); 
}); 

但它會更好，而不是使用的ID類。

$('.update').click(function() { 
    var $this = $(this); 
    var name = $this.siblings('.bandname').val(); 
    var bandid = $this.siblings('.bid').val(); 
    var mbid = $this.siblings('.mbid').val(); 
    $('#msg').text('updating...'); 
    $.post('func/update_bandname.php', { 
      name: name, 
      bandid: bandid , 
      mbid:mbid 
    }, function(data) { 
      $this.siblings('.msg').text(data); 
    }); 
}); 

Answer 3

JS：

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script> 
$(function() { 
    $('form').submit(function(data) { 
    $.post('func/update_bandname.php', $(this).serialize(), function(data) { 
     $('#msg1').text(data); 
    }); 
    }); 
}); 
</script> 

PHP：

echo "<tr>"; 
echo "<td>"; 
echo "<form>"; 
echo "<input type=\"text\" name=\"bandname-".$i."\" id=\"bandname-".$i."\" value=\"".$name ."\"/>&nbsp;"; 
echo "<input id=\"update".$i."\" type=\"button\" name=\"update".$i."\" value=\"update\" class=\"dp\"/>"; 
echo "<span id=\"msg".$i."\"></span><input type=hidden id=\"bid-".$i."\" value=\"".$_REQUEST[bid] ."\" name=bid-".$i."\" />"; 
echo "<input type=hidden id=\"mbid-".$i."\" value=\"".$bandid."\" name=mbid-".$i."\" />"; 
echo "</form>"; 
echo "</td>"; 
echo "</tr>"; 
$i++;