Question

我正在创建一个网页，其中包含一个非常简单的订阅表单，基本上收集了对该产品感兴趣的人的电子邮件地址。对于此表单，我使用rapidmail，它提供类似于mailchimp的服务。我的问题是，在输入电子邮件地址后，用户将被重定向到新页面，其中显示成功（或错误，如果电子邮件地址有故障）消息。我想要的是这些消息显示在与表单相同的页面上，因为我被重定向到的页面很难看。 Rapidmail还提供了使用iframe的替代方案，有趣的是，它在表单的同一页面上显示成功/错误消息;不幸的是，它同样难看，其定制选项非常有限，不适合我的页面设计。

我希望像this这样的解决方案是可能的，但我不知道rapidmail是否提供了另一个终端＆＃34;这让我能够使用JSON＆＃34;如在链接中。

这就是我的表格（非常标准）

＆＃13;

<form action="https://tools.emailsys.net/121/1550/18cxn42/subscribe/form.html" method="post">
    <div class="form">
        <div class="form_border">
            <ul>
                <li>
                    <label class="field_label required" for="email">E-Mail: </label>
                    <input type="text" class="form_field" name="email" id="email" value="" />
                </li>
                <li id="firstname_form">
                    <label id="firstname_label" class="field_label" for="firstname">Vorname: </label>
                    <input type="text" class="form_field" name="firstname" id="firstname" value="" />
                </li>
                <li class="form_button">
                    <input type="submit" class="form_button_submit" value="Anmelden" />
                </li>
            </ul>
        </div>
    </div>
</form>

＆＃13;

Answer 1

JS：

/*
* Get errors of RapidMail forms
 */
var rapidmail_form = document.getElementById('rapidmail_form');
if (typeof(rapidmail_form) != 'undefined' && rapidmail_form != null && rapidmail_form.length)// if we have a RapidMail form
{
    function getUrlVars() {
        var vars = {};
        var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) {
            vars[key] = value;
        });
        return vars;
    }

    // email
    var field_email = getUrlVars()["field_email"];
    if (field_email.length > 0) {
        document.getElementById("email").value = field_email;// get previous email
    }
    // lastname
    var field_lastname = getUrlVars()["field_lastname"];
    if (field_lastname.length > 0) {
        document.getElementById("lastname").value = field_lastname;// get previous lastname
    }
    // Error message
    var error_email = getUrlVars()["error_email"];
    var error_lastname = getUrlVars()["error_lastname"];

    // Gather all errors into one.
    var error_text = '';
    // error_email
    if (error_email != 'undefined' && error_email != null && error_email.length > 0) {
        error_email = error_email.replace(/\+/g, ' ');
        error_text += '<p>' + error_email + '</p>';
    }
    // error_lastname
    if (error_lastname != 'undefined' && error_lastname != null && error_lastname.length > 0) {
        error_lastname = error_lastname.replace(/\+/g, ' ');
        error_text += '<p>' + error_lastname + '</p>';
    }

    // Input gathered text to h5
    if (document.getElementById("rapidmail_form_error") != 'undefined' && document.getElementById("rapidmail_form_error") != null) {
        document.getElementById("rapidmail_form_error").innerHTML = error_text;// show Error
    }
}

HTML：

<div id="rapidmail_form_error"></div>
<form action="https://tools.emailsys.net/121/1550/18cxn42/subscribe/form.html" method="post" id="rapidmail_form">

因此，它查看RapidMail生成并解析的URL。最后，它收集所有错误并将其粘贴到rapidmail_form_error id元素中。

只需将当前URL放在：

<input type="hidden" name="url_error" value="THE_URL_OF_YOUR_FORM" />

邮件订阅后的Rapidmail订阅表格重定向 - Mailchimp

1 个答案: