动态更改表单操作不适用于 MailChimp

Question

我正在使用复选框动态更改 MailChimp 表单上的表单操作。当加载 DOM 时，表单操作 URL 是这样的：

https://X.us3.list-manage.com/subscribe/post?u=X&amp;id=X&EBIRD=XYZ

当我提交表单时，XYZ 的 EBIRD 值被推送到 MailChimp。现在，当我选中复选框时，我可以从 DOM 和我的控制台看到新的表单操作是这样的：

https://X.us3.list-manage.com/subscribe/post?u=X&amp;id=X&EBIRD=NEW-VALUE

为什么提交表单仍然推送 XYZ 而不是 NEW-VALUE？我一直在联系 MailChimp 技术支持。他们说在页面上选择"View Source"时，旧值还在。但这不只是因为页面最初是这样加载的吗？

相关jQuery:

    var formActionYes = "https://X.us3.list-manage.com/subscribe/post?u=X&amp;id=X&EBIRD=NEW-VALUE";
    var formActionNo = "https://X.us3.list-manage.com/subscribe/post?u=X&amp;id=X&EBIRD=NEW-VALUE-2";

    $('#cu-ebird').change(function() {
        if(this.checked) {
            $("#mc-embedded-subscribe-form").prop('action',formActionYes);
            console.log($("#mc-embedded-subscribe-form").prop('action'));
        } else {
            $("#mc-embedded-subscribe-form").prop('action',formActionNo);
            console.log($("#mc-embedded-subscribe-form").prop('action'));
        }               
    });

控制台记录我想要的。 DOM 显示了我想要的。 MailChimp 收到旧值。

我错过了什么？

Answer 1

不要在 JavaScript 字符串中使用 HTML 实体，例如 &。这仅在 HTML 代码中处理，而不是在 JavaScript.

中分配属性时

var formActionYes = "https://X.us3.list-manage.com/subscribe/post?u=X&id=X&EBIRD=NEW-VALUE";
var formActionNo = "https://X.us3.list-manage.com/subscribe/post?u=X&id=X&EBIRD=NEW-VALUE-2";

虽然我不确定为什么这会影响 EBIRD 参数。它应该导致 id 参数重命名为 amp;id.

您可以尝试的另一件事是使用 .attr() 而不是 .prop()。

Answer 2

这可以通过完全不尝试更改表单操作来解决。只需从表单操作中删除合并字段。相反，您需要在表单中添加一个隐藏的输入字段：

<input id="ebird" type="hidden" name="EBIRD" value="">

然后使用脚本更改此值：

$("#ebird").attr('value','NEW-VALUE');

瞧，一切都显示在 MailChimp 中。

动态更改表单操作不适用于 MailChimp

Dynamically changing form action not working for MailChimp

javascript

jquery

mailchimp