javascript - 需要帮助将站点 cookie 连接到表单

Question

我正在管理一个网站，我们在网站页脚中创建了一个 cookie，我需要在我嵌入的表单中使用该 cookie。

我不确定如何将 cookie 连接到表单。该站点使用 Hubspot 模块，页脚的 html 是使用脚本标签创建的。该表单还有一个脚本标记作为其代码的一部分。由于我不能嵌套脚本标签，所以我还没有找到一个很好的解决方案来连接这些项目。

我对任何智慧或想法持开放态度，因为我尝试了各种事情但没有成功。如果有人可以启发我，我不明白为什么 htmlData 会执行两次。谢谢！

这是省略了一些行的表单和其他脚本：

<div class="form-embed" data-form-id="1" data-user-id="2"></div><script async src="//mywebsite.com/formembed/embedform.js"></script>

<script>
        $(document).ready(function(){
    
            var officerInfo = getCookie('officerInfo');
            var hashVal = window.location.hash;
           
            if (officerInfo !== null){
                 var officerName = '';
                     officerName = '#'+officerInfo.fname+'_'+officerInfo.lname;
                if(hashVal && hashVal != officerName){
                    setOfficer();    
                }else{
                    
                    officerInfo = JSON.parse(officerInfo)
                    console.log('GET = ', officerInfo);
    
                    var htmlData = '';
                    htmlData +='<div class="officer-inner">';
                    htmlData +='    <div class="left-part">';
                    htmlData +='        <div class="info-section">';
                    htmlData +='            <div>';
                    htmlData +='                <span>'+officerInfo.fname+'</span><strong>'+officerInfo.lname+'</strong>';
                    htmlData +='            </div>';
                    htmlData +='        </div>';
                    htmlData +='    </div>';
                    htmlData +='    <div class="right-part">';
                    htmlData +='        <ul>';
                    if(officerInfo.link){
                        htmlData +='            <li><a href="'+officerInfo.link+'" title="Apply Now"> Apply Now </a></li>';
                    }
                   
                    htmlData +='        </ul>';
                    htmlData +='    </div>';
                    htmlData +='</div>';
    
                    var currUrl = window.location.href;
                    if(currUrl && currUrl.indexOf('/loan-officer/') == -1){               
                        $('.last-visited-officer > .container').html(htmlData);
                        $('.last-visited-officer').fadeIn(300);
                        currUrl = currUrl.split('#')[0];
                        history.pushState("","", currUrl+'#'+officerInfo.fname+'_'+officerInfo.lname);
                    }
                }
            }else{
                setOfficer();
            }
            
            if($('.loan_officer_single').length > 0){
                var fname = $('.right-shaped-banner .banner-caption h2').text();
                var lname = $('.right-shaped-banner .banner-caption h1').text();
                var link = window.location.href;
    
                var officer = { fname: fname, lname: lname, link: link };
                officer = JSON.stringify(officer);
                console.log(officer);
                setCookie('officerInfo', officer, 1);
            }
    
            setTimeout(function(){
                var arrHide = ['{{request.scheme}}://{{request.domain}}/jobs']; 
                var currUrl = '{{ request.full_url }}';
    
                if(jQuery.inArray(currUrl, arrHide) !== -1){
                    $('.last-visited-officer').hide();
                }
            },500);
        });
        
        function setOfficer(){
    
                var hashVal = window.location.hash;
                if(hashVal){
                    hashVal = hashVal.replace('#','');
                    hashVal = hashVal.split('_');
                    var fname = hashVal[0];
                    var lname = hashVal[1];
                    console.log(fname, lname)
                    $.ajax({
                        url: 'https://mywebsitename.com='+fname+'&last_name='+lname,
                        type: 'GET',
                        dataType: 'json',
                        success: function(data){
                            console.log(data)
                            if(data.objects && data.objects.length > 0)
                            {
    
                                $.each(data.objects, function(i, val){
    
                                    var fname = val.values['1'];
                                    var lname = val.values['4'];
                                    var link = val.values['23'];
                                    
                                    var officer = { fname: fname, lname: lname, link: link };
                                    officer = JSON.stringify(officer);
                                    console.log(officer);
                                    setCookie('officerInfo', officer, 1);
    
                                    var htmlData = '';
                                    htmlData +='<div class="officer-inner">';
                                    htmlData +='    <div class="left-part">';
                                    htmlData +='        <div class="info-section">';
                                    htmlData +='            <div>';
                                    htmlData +='                <span>'+fname+'</span><strong>'+lname+'</strong>';
                                    htmlData +='            </div>';
                                    htmlData +='        </div>';
                                    htmlData +='    </div>';
                                    htmlData +='    <div class="right-part">';
                                    htmlData +='        <ul>';
                                    if(link){
                                        htmlData +='            <li><a href="'+link+'" title="Apply Now"> Apply Now </a></li>';
                                    }
                                    htmlData +='        </ul>';
                                    htmlData +='    </div>';
                                    htmlData +='</div>';
    
                                    var currUrl = window.location.href;
                                    if(currUrl && currUrl.indexOf('/loan-officer/') == -1){               
                                        $('.last-visited-officer > .container').html(htmlData);
                                        $('.last-visited-officer').fadeIn(300);                                    
                                    }
    
                                });
                            }
                        }
                    });
                }
                               
        }
                               
        function setCookie(name,value,days) {
            var expires = "";
            if (days) {
                var date = new Date();
                date.setTime(date.getTime() + (days*24*60*60*1000));
                expires = "; expires=" + date.toUTCString();
            }
            document.cookie = name + "=" + (value || "")  + expires + "; path=/";
        }
        function getCookie(name) {
            var nameEQ = name + "=";
            var ca = document.cookie.split(';');
            for(var i=0;i < ca.length;i++) {
                var c = ca[i];
                while (c.charAt(0)==' ') c = c.substring(1,c.length);
                if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
            }
            return null;
        }
        function eraseCookie(name) {   
            document.cookie = name+'=; Max-Age=-99999999;';  
        }
    
        $(window).on('load', function(){
            if($('.last-visited-officer').is(':visible')){
                $('.footer-section').addClass('officer-space');
            }
        });
    
    </script>

标签： javascriptjqueryajaxformshubspot