如何在对应产品页自动勾选Contact Form 7表单的匹配产品复选框

可行实现代码 #

直接替换你原来的jQuery代码即可：

$(document).ready(function() {
    // 获取隐藏字段存储的当前页面产品名称
    const currentProduct = $('input[name="page-title"]').val().trim();
    // 未获取到有效产品名时不执行后续逻辑
    if (!currentProduct) return;
    // 遍历所有产品复选框，值匹配则自动勾选
    $('input[name="products[]"]').each(function() {
        if ($(this).val().trim() === currentProduct) {
            $(this).prop('checked', true);
            // 确认产品值唯一时可开启下方注释，匹配后直接结束遍历提升性能
            // return false;
        }
    });
});

额外说明 #

1. 你原来的代码里隐藏字段选择器写错了，你提供的HTML结构中隐藏字段没有id="product-name"属性，所以用input[name="page-title"]才能正确拿到值
2. 代码里加了trim()方法，是为了避免值两端多余空格导致匹配失败，如果你的产品名本身就包含首尾空格可以去掉这个方法
3. 如果存在产品名大小写不一致的匹配需求，可以把判断条件改成不区分大小写的版本：

if ($(this).val().trim().toLowerCase() === currentProduct.toLowerCase())

4. 如果站点存在jQuery冲突问题（比如控制台报$ is not defined错误），可以用兼容版代码：

jQuery(document).ready(function($) {
    const currentProduct = $('input[name="page-title"]').val().trim();
    if (!currentProduct) return;
    $('input[name="products[]"]').each(function() {
        if ($(this).val().trim() === currentProduct) {
            $(this).prop('checked', true);
        }
    });
});

内容的提问来源于stack exchange，提问作者Amesey