将几个 cookie 的值插入隐藏的表单字段

Question

我有一个简单的表单，需要将 cookie 的值插入到表单中的中间字段（优惠券）中。

我有这个表格：

<form action="/members/signup" class="am-signup-form" id="page-0" method="post" name="page-0">
<input id="_qf_page-0_next-0" name="_qf_page-0_next" type="submit" value="Get Access Now">
<input type="hidden" name="coupon" id="coupon-0" value="" />
</form>

我在表单下方插入了这个 javascript：

<script type="text/javascript">
(function(){
    var cookies;

    function readCookie(name,c,C,i){
        if(cookies){ return cookies[name]; }

        c = document.cookie.split('; ');
        cookies = {};

        for(i=c.length-1; i>=0; i--){
           C = c[i].split('=');
           cookies[C[0]] = C[1];
        }

        return cookies[name];
    }

    window.readCookie = readCookie; 
})();

$(document).ready(function(){
    //Get cookie you want.
    var referrer = window.readCookie('readCookie_mycookiename1') || ''; 
    //Set cookie value to hidden field.        
    $('#coupon').val(referrer);
});
</script>

我似乎无法让表单/脚本正常工作。 cookie 值未插入到隐藏字段的值中。

另外，我需要将 3 个不同的 cookie 插入到隐藏字段的值中。可能不存在 cookie，可能存在 1 个 cookie，或者可能存在所有 3 个 cookie（取决于站点访问者）。

如果所有三个 cookie 都存在，我需要将它们全部插入到单个隐藏字段的值中（它们的外观并不重要）。有没有办法修改脚本，以便我可以从多个 cookie 中获取值，所有这些值都插入到单个隐藏字段值中？

Answer 1

您正在更改不存在的#coupon 的值。您隐藏输入的 id 是 coupon-0。

至于获取0-3个cookie并将它们放置在隐藏字段中：

function getCookies(...names) {
  const cookies = document.cookie.split('; ').reduce((cookieObj, cookie) => {
    const [name, value] = cookie.split('=');

    return {
      ...cookieObj,
      [name]: value,
    };
  }, {});

  return names.reduce((values, name) => {
    if (cookies[name]) {
      values.push(cookies[name]);
    }

    return values;
  }, []);
}

console.log(getCookies('_ga', 'cookie_that_doesnt_exist', '_gid'));

这将返回一个cookie值数组，顺序将由您传递的名称的顺序决定。如果 cookie 名称不存在，则跳过它。只需加入数组即可设置输入值。