0

我正在尝试建立一个订阅表单。我不能在我的网站上运行 php，并且我不希望用户离开主网站来订阅时事通讯。我将此示例用作服务器端。如果您尝试输入电子邮件，即使电子邮件已添加到 mailchimp 列表，您也会被重定向并显示错误消息。

<div id="email">
<span>Your email..</span>
<form action="http://simondahla.com/jolliassets/notify.php" id="notify" method="POST">
    <input type="text" placeholder="your@email.com" name="email" id="address" data-validate="validate(required, email)"/>
    <span>We'll never spam or give this address away</span>
    <button type="submit">&#187;</button>
</form>
<span id="result"></span>


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#notify').submit(function() {
        var action = $(this).attr('action');
        $.ajax({
            url: action,
            type: 'POST',
            data: {
                email: $('#address').attr('value')
            },
            success: function(data){
                $('#result').html(data).css('color', 'green');
            },
            error: function() {
                $('#result').html('Sorry, an error occurred.').css('color', 'red');
            }
        });
    });
});
</script>

问题的活生生的例子

4

2 回答 2

1

您需要false从您的提交处理程序返回。这是为了防止浏览器执行默认操作，即以正常方式提交表单。

$('#notify').submit(function() {
   // .. your ajax call
   return false;
});
于 2012-11-04T14:29:30.223 回答
1

从您的 PHP 函数中，您将根据代码的成功或失败返回所需的值。

成功：

print json_encode(array("status"=>"success","message"=>'Successfully added'));

失败的：

print json_encode(array("status"=>"error","message"=>'There was an error'));

然后在 HTML 中返回该消息，如下所示：

success: function(data){
            $('#result').html(content.message).css('color', 'green');
        },
        error: function() {
            $('#result').html(content.message).css('color', 'red');
        }
于 2012-11-04T14:50:00.413 回答