简体   繁体   中英

JS for setting cookies on Form Submit works in Firefox but not Edge/Chrome

I have a bootstrap modal that pops up when a page loads asking a user to set their location and saves this value to a cookie.

This all works fine in Firefox however doesn't work in Edge or Chrome. Anyone have any ideas?

<script>
function setCookie(cookieName, cookieValue, nDays) {
    
    var today = new Date();
    var expire = new Date();

    if (!nDays) 
        nDays=1;
    expire.setTime(today.getTime() + 3600000*24*nDays);
    document.cookie = cookieName+"="+escape(cookieValue) + ";expires="+expire.toGMTString();
    return false
}
</script>

<div class="modal_container">
     
        <!-- Modal -->
        <div class="modal fade" id="store_prompt" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <h5 class="modal-title" id="exampleModalLongTitle">Location Number</h5>
                </div>
                <div class="modal-body">
                    <form onsubmit="javascript:return setCookie('location', this.querySelector('select').value, 365);">
                        <div class="form-group">
                            <label for="LocationSelect">Please select your location below.</label>
                            <select class="form-control" id="LocationSelect">
                              <option value='1' >1 - Location A</option>
                              <option value='2' >2 - Location B</option>
                            </select>
                        </div>
                        <button type="submit" class="btn btn-primary btn-lg btn-block" onclick="closemodal(); location.reload();">Save changes</button>
                    </form> 
                </div>
              </div>
            </div>
</div>

Do you test the code through file protocol like file:///C:/... ? If so, I can reproduce the situation you encountered.

Your code is right. But cookies are not set when browsing using the file:/// protocol, depending on the browser. You need to run your page on a http/https server then the code can work on all browsers.

Result: 在此处输入图像描述

I think this might be because of the issues mentioned in this question. Please go through these. It might solve your issue. Why would setting document.cookie not work in Chrome?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM