2009-09-12 73 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