AJAX表单提交(仅限Firefox)

时间:2010-11-30 08:22:26

标签: php javascript ajax firefox forms

我在我的网站(www.chrisanstey.co.uk)上运行一个AJAX联系表格,该表格不是仅在Firefox中提交,而是在其他所有浏览器中都可以正常使用。表单使用以下PHP文件:

<?php

$to = "me@somewhere.com"; //This is the email address you want to send the email to

if(!isset($_GET['action']))
{
die("You must not access this page directly!"); //Just to stop people from visiting contact.php normally
}

/* Now lets trim up the input before sending it */

$name = trim($_GET['name']); //The senders name
$email = trim($_GET['email']); //The senders email address
$subject = "A message sent from " . $name . " on Chris Anstey's portfolio"; //The senders subject
$message = trim($_GET['msg']); //The senders message

mail($to,$subject,$message,"From: ".$email.""); //a very simple send

echo 'contactarea|<p>Thank you '.$name.' for your message, I will reply to you as soon as I can.</p>'; //now lets update the "contactarea" div on the contact.html page. The contactarea| tell's the javascript which div to update.
?>

以及以下javascript文件:

function createRequestObject() {
    var ro;
    var browser = navigator.appName;
    if(browser == "Microsoft Internet Explorer"){
        ro = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        ro = new XMLHttpRequest();
    }
    return ro;
}

var http = createRequestObject();

function sendemail() {
 var msg = document.contactform.msg.value;
 var name = document.contactform.name.value;
 var email = document.contactform.email.value;
 document.contactform.send.disabled=true; 
 document.contactform.send.value='Sending....';

    http.open('get', 'contact.php?msg='+msg+'&name='+name+'&email='+email+'&action=send');
    http.onreadystatechange = handleResponse;
    http.send(null);
}

function handleResponse() {
    if(http.readyState == 4){
        var response = http.responseText;
        var update = new Array();

        if(response.indexOf('|' != -1)) {
            update = response.split('|');
            document.getElementById(update[0]).innerHTML = update[1];

        }
    }
}

表单位于Wordpress页面中,通过以下HTML在模板上调用:

<div id="contactarea">
<form name="contactform" id="contactform">
<p>Full Name:<br /> 
    <span class="wpcf7-form-control-wrap your-name"><input type="text" name="name"></span></p>
<p>Email:<br /> 
    <span class="wpcf7-form-control-wrap your-email"><input type="text" name="email"></span></p>
<p>Message:<br /> 
    <span class="wpcf7-form-control-wrap your-message"><textarea name="msg" rows="6" id="textarea"></textarea></span></p>
<p><input type="submit" value="Send Email" name="send" id="submitbutton" onClick="sendemail();"></p>
</form>
</div>

如果有任何想法或遇到类似的问题,AJAX无法在Firefox中运行,请您回复。任何帮助将不胜感激!

2 个答案:

答案 0 :(得分:1)

嗯,您的查询可以缓存一个。是不是在调用php?该代码在firefox中适用于我,但在它运行一次后,它应该缓存它,所以它不会再调用它。

答案 1 :(得分:0)

我在firefox中测试了它并且ajax调用工作正常...我不认为这是问题..尝试在firefox上安装firebug插件所以我们可以看到错误消息是什么

修改 如果我从你的评论中正确理解,当你点击提交按钮时页面就会改变,而你不想要...如果就是这样,那么只需将提交按钮上的onClick属性更改为

onClick="sendemail();return false;"

或将您的输入提交更改为输入按钮...这是因为当您单击提交按钮时,即使您有onClick事件,也会发送表单,因此return false应该停止它...当您想要阻止默认事件

时,它与链接相同 祝你好运