帶有html / php表單（使用ajaxForm）的jQuery僅工作一次

Question

我已經嘗試解決這個問題一段時間了，但沒有成功。 需要Stackoverflow！

基本上，腳本的作用是從數據庫中獲取用戶個人資料圖片。 主持人可以看到它們，然后單擊“禁令”按鈕，然后banPeopleProcess.php文件具有從數據庫中刪除圖片等的代碼。示例： http ://screencast.com/t/uFtFgKxYx4s

每張圖片都是一個表單，它們都有相同的表單ID。 這是HTML（在php echo中）：

<div>
<form id=\"banPeopleForm\" action=\"banPeopleProcess.php\" method=\"post\">
    <input type=\"hidden\" name=\"toid\" value=". $i ." />
    <input id=\"banPeopleBtn\" type=\"submit\" name=\"submit\" value=\"BAN\" />
</form>
</div>

JS當前看起來像這樣：

<script type="text/javascript"> 

function banPeople() {
    $('#banPeopleForm').ajaxForm(function() {
        $('#banPeopleBtn').hide(); 
    });
}

$(document).ready(function() {
    $('#banPeopleBtn').click(function() {
        banPeople();
        });
    }); 
</script> 

• 實際上只有第一個加載的圖片會執行其應做的工作（按鈕處於隱藏狀態，表單已提交等）
• 對於以下圖片，JS不起作用，它們僅遵循普通的HTML格式-單擊“禁止”按鈕時，我們將重定向到banPeopleProcess.php。
• 話雖如此，看來只有第一個照片ID才裝有JS，而其他照片沒有。 我仍然不知道該怎么做。

幫助非常感謝的家伙！

Answer 1

您應該阻止form提交php文件，並使用ajax調用php.something之類的東西

$(document).ready(function() {
    $('#banPeopleBtn').click(function(e) {
        e.preventDefault();
        banPeople();    
        $.ajax({
        type: "POST",
        url: "banPeopleProcess.php"
        });

        });
    }); 

Answer 2

每張圖片使用不同的ID。 使用不同的表單ID並為每張圖片提交ID。 使動態javascript ID以及后面的$（'＃banPeopleBtn'+ id）.hide（）; 由於javascript不能在同一頁面中使用相同的ID。