php - MailChimp for Wordpress 多种形式

Question

我们使用 Contact Form 7 和 MailChimp for Wordpress 插件。一切正常，但是我们将 [mc4wp_checkbox] 的短代码添加到每个表单，有时页面上可能有 2 或 3 个这样的表单，它们都使用相同的短代码。

由于样式的原因，我们修改了插件以包含标签并将输入与标签下的输入分开......

// checkbox
    $content .= '<p id="mc4wp-checkbox">';
    $content .= '<input class="css-checkbox" id="'. $this->checkbox_name .'" type="checkbox" name="'.$this->checkbox_name.'" value="1"  '. $checked . ' /> ';
    $content .= '<label for="'.$this->checkbox_name.'" class="css-label">';
    $content .= $label;
    $content .= '</label>';
    $content .= '</p>';

我们使用的 CSS 是这样的:

#mc4wp-checkbox input[type=checkbox].css-checkbox {
                        position:absolute; z-index:-1000; top:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;
                    }

                    #mc4wp-checkbox input[type=checkbox].css-checkbox + label.css-label {
                        padding-left:37px;
                        height:31px; 
                        display:inline-block;
                        line-height:31px;
                        background-repeat:no-repeat;
                        background-position: 0 0;
                        font-size:31px;
                        vertical-align:middle;
                        cursor:pointer;
                        font-size:11px;

                    }

                    #mc4wp-checkbox input[type=checkbox].css-checkbox:checked + label.css-label {
                        background-position: 0 -31px;
                    }
                    #mc4wp-checkbox label.css-label {
            background-image:url(http://csscheckbox.com/checkboxes/u/csscheckbox_b133c39c81582c4d41ca75f74160bf35.png);
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

所以问题是因为我们在所有表单中使用相同的代码，当您单击复选框时它只会更新页面上表单的第一个实例，而不是特定表单 - 所以如果我们在同一个表单上有 3 个表单页面，那么它只会更改第一个表单的复选框，即使您单击表单 3 中的复选框也是如此。我认为这是因为标签 - 但不知道如何使每个表单都独一无二。这是进一步的插件破解吗？

Answer 1

由 JQuery 使用目标 attr 和 id 替换解决。