2009-09-12 72 views
0

我完全新手jQuery的,我查docs.jquery,搜索在谷歌,問朋友,還是沒能找到解決辦法:(jQuery的不工作的.html()返回

我有一個ID = EMail的DIV,它包括一個段落(<p>Please enter email...</p>)和一個表格(<form></form>) 當訪問者輸入他/她的電子郵件地址形成輸入,並按下「發送」按鈕時,JQuery讀取輸入。地址),並郵寄到「addEMail.php」雖然這樣做,<div id=EMail>只顯示「<p>Please wait, blah blah</p>」和禁用表單(未禁用,刪除)

在addEMail.php,它返回兩件事情;

  • 如果電子郵件地址有效,「<p>Thank you</p>」。
  • 如果無效,「<p>Please enter valid email address</p><form>...</form>」。

返回的html顯示在<div id=EMail>中。

我的問題是,如果電子郵件地址無效,JQuery不適用於返回的元素。點擊按鈕時,瀏覽器會添加電子郵件.php。

要解決,我想GET和POST方法,添加數據類型: 「HTML」,既檢查本地主機,和正常宿主等

感謝

JS在index.php文件;

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('.button').click(saveEMail); 
}); 

function saveEMail() 
{ 
var userEMail = $('form').serialize(); 
$('#eMail').html('<p>Please wait while saving your email: </p>'.userEMail); 
$.ajax({ 
    type: 'POST', 
    url: 'http://localhost/addEMail.php', 
    dataType: 'html', 
    data: userEMail,  
    success: function(result) { 
    $('#eMail').html(result); 
    } 
}); 
return false; 
} 
</script> 

index.php中的表單元素;

<div class="box" id="eMail"> 
    <p>Please blah blah blah</p> 
    <form name="addEMail" action="http://localhost/addEMail.php" method="post"> 
    <input type="text" name="eMail" /> 
    <input class="button" type="submit" value="Send" /> 
    </form> 
</div> 

addEMail.php;

<?php 

if (checkEmail($email) == FALSE) { 
    echo("<p>Please enter a valid email address</p>"); 
    echo("<form ... </form>"); // exactly same form as above 
} 
else { 
    echo("<p>thank you blah blah</p>"); 
} 

?> 
+1

爲什麼你需要'== FALSE'?如果它是假的,那麼'else'會自動啓動。 – bandi 2009-09-12 08:07:14

回答

2

這是因爲如果執行後,阿賈克斯重新創建按鈕,它不再有連接到它的Click事件處理程序,所以saveEMail功能將不會被調用的電子郵件是在你的服務器腳本無效它只會提交表單。您可以使用live函數:

$(document).ready(function() { 
    $('.button').live('click', saveEMail); 
}); 

這樣,如果按鈕被重新創建它會自動重新連接的事件處理程序,瀏覽器將連續觀看。

另一種替代方法是再次呼叫$('.button').click(saveEMail);回撥的ajax請求,恕我直言,這是不是很好,因爲它會導致重複。

+0

感謝您的解釋。它也能很好地工作。 – Turcia 2009-09-12 08:34:41

+1

準確地說,live不會「自動重新連接事件處理程序」 - 它最初會綁定一個單一的事件處理程序,用於監視整個文檔中的任意click元素,並查看事件的目標元素是否與提供給它的選擇器相匹配。這被稱爲事件代表團。 – 2009-09-12 08:52:52