jQuery：返回「成功」的表單需要重新綁定

一個簡短的問題。我正在使用jQuery.forms.js插件。jQuery：返回「成功」的表單需要重新綁定

我有一個表單發佈到php頁面並用jSon返回數據。

返回的數據是新窗體的代碼（它替換用於發佈信息的窗體）。新的表單沒有綁定到任何jQuery函數，因爲它在頁面加載時不在。

那麼，如何才能獲得ajax表單來識別新表單，這樣如果我需要第二次使用表單，它也是利用jQuery函數呢？

// jQuery for submitting info to php doc and, on success, replacing the form 
$(document).ready(function() { 
    jQuery('form[id*=postOnline]').ajaxForm({ 
     dataType: 'json', 
     success: function(data) { 
      $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow'); 
      bindNote(); 
     } 
    }); 
}); 

<!-- /////////////////////// POST ONLINE /////////////////////// --> 

<div id='onlineStatus<?php echo $b_id ?>' class='postOnline'> 
    <form name="postOnline" id="postOnline<?php echo $b_id ?>" action="postOnline.php" method="post"> 
    <input type="hidden" value="<?php echo $b_id ?>" name="b" /> 
    <input type="hidden" value="1" name="p" /> 
    <input type="submit" class="button" value="Post Online" /> 
    </form>   
</div> 

<!-- /////////////////////// POST ONLINE /////////////////////// --> 


// ... code for entering data into database and then... 
$result = mysql_query($sql); 
if($result) { 
if($show == '1'){$val = 'remove from online'; $num='0';} 
if($show == '0'){$val = 'show online'; $num='1';} 

$return = " 
<form name='postOnline' id='postOnline$id' action='postOnline.php' method='post'> 
<input type='hidden' value='$b_id' name='b' /> 
<input type='hidden' value='$num' name='p' /> 
<input type='submit' class='button' value='$val' /> 
</form> 
"; 
    print json_encode(array("rid" => $id, "formed" => $return)); 
} 
?>

來源

2009-02-15 superUntitled

最簡單的解決方法是不使用jQuery的形式插件，做手工，這實在不是很困難：

$(document).ready(function() { 
    jQuery('form[id*=postOnline]').live('submit', function() { 
     var formdata = $(this).serialize(); 
     $.ajax({ 
      type: $(this).attr('method'), 
      url: $(this).attr('action'), 
      dataType: 'json', 
      data: formdata, 
      success: function(data) { 
       $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow'); 
       bindNote(); 
      } 
     }); 
     return false; 
    }); 
});

現在，因爲你正在使用jQuery的新的（1.3）live功能，任何形式的你添加匹配的form[id*=postOnline]選擇器仍將與此事件連接。

另外，你可以打開jQuery窗體代碼，找到它綁定的任何地方，並嘗試修改它，以便它使用它live。即使是另一個替代方案是包括在一個函數的接線，你的成功函數末尾調用它，就像這樣：

function bindForm() { 
    jQuery('form[id*=postOnline]').ajaxForm({ 
     dataType: 'json', 
     success: function(data) { 
      $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow'); 
      bindNote(); 
      bindForm(); 
     } 
    }); 
} 

$(document).ready(function() { 
    bindForm(); 
});

我不認爲這是很整齊，但它應該工作。

來源

2009-02-15 06:14:00

謝謝你的幫助！嗯。這些解決方案都不起作用。在.live文件中，表單根本無法識別jQuery並直接發佈到php頁面。第二個解決方案是在第一個表單上識別jQuery，但不對第二個表單做任何提交。 – superUntitled 2009-02-15 06:37:31

您需要在ajax調用之後重新綁定事件處理程序。我聽說在jquery的新版本live events中有一個新特性，但這會讓這個不必要。

來源

2009-02-15 05:38:37 airportyh

如果無論出於何種原因，您都會遇到1.3版本以前的jQuery，請使用「livequery」插件。

來源

2009-02-18 05:47:48 artlung

jQuery：返回「成功」的表單需要重新綁定

回答

相關問題