Silverstripe / PHP / jQuery - 一旦表单被用户填写,防止它自动出现在每次访问 [英] Silverstripe/PHP/jQuery - Once form has been filled out by user, prevent it from automatically appearing for each visit

查看:233
本文介绍了Silverstripe / PHP / jQuery - 一旦表单被用户填写,防止它自动出现在每次访问的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在处理一个有两种状态的表单:在桌面视图中,页面加载5秒后,表单从屏幕右侧滑出,然后用户可以单击按钮关闭/打开它。在移动视图中,表单由按钮触发并显示为弹出窗口。



在构建它时,我没有考虑到让表单自动滑入或弹出每一页都会带来不便。如果用户已经关闭表单,我已经使用HTML5会话存储来防止表单在页面加载时自动打开。

现在问题出现了,如果用户确实填写了表单,表单不应该自动滑出或弹出。我认为这将涉及以某种方式在表单提交时设置cookie,并在每次用户访问该网站时维护该cookie。然而,我并不是很熟悉饼干 - 这对我来说绝对是一个新的领域,因为我以前从来没有对它们做过任何事情。



作为一个旁注,我们有涉及SharpSpring集成(即用户填写表单并将其数据发送到SharpSpring帐户以供进一步市场营销使用,不知道什么不确定)。


$
$ b

引导式HTML表单: p> < div class =mobile-viewstyle =right:51px;>
< a class =mobile-btn>
< span class =glyphicon glyphicon-arrow-left icon-arrow-mobile mobile-form-b​​tn>< / span>
< / a>
< / div>
< div class =slider register-photo>
< div class =form-inner>
< div class =form-container>
< form method =postenctype =multipart / form-dataid =browserHangForm>
< a class =sidebar>
< span class =glyphicon glyphicon-arrow-left icon-arrow arrow>>< / span>
< / a>
< a class =closeBtn>
< span class =glyphicon glyphicon-remove>< / span>
< / a>

< h2 class =text-center black>接收某某书的免费副本!
< / h2>

< p class =light> - 免费下载 - < / p>

< p class =errors-container light>请填写必填字段。< / p>

< div class =success> $ SiteConfig.GatewayFormThankYou< / div>
< div class =form-field-content>
< div class =form-group>
< input class =form-control FirstNameTxttype =textname =first_nameplaceholder =* First Name
autofocus =>
< / div>
< div class =form-group>
< input class =form-control LastNameTxttype =textname =last_nameplaceholder =* Last Name
autofocus =>
< / div>
< div class =form-group>
< input class =form-control EmailTxttype =emailname =Emailplaceholder =* Email
autofocus =>
< / div>
< div class =form-group>
< input class =form-control CompanyTxttype =textname =Companyplaceholder =* Company
autofocus =>
< / div>
< div class =form-group submit-button>
< button class =btn btn-primary btn-block button-submittype =button>发送给我< / button>
< img src =/ themes / simple / images / ajax-loader.gifclass =progressalt =正在提交......>
< / div>
< / div>
< br />

< div class =privacy-link>
< a href =privacy-policyclass =alreadytarget =_ blank>< span
class =glyphicon glyphicon-lock icon-lock>< / span> ;我们绝不会分享您的信息。< / a>
< / div>
< / form>
<%if if SiteConfig.GatewayFormEmbedCodeID%>
< input type =hiddenid =gatewayEmbedIDvalue =$ SiteConfig.GatewayFormEmbedCodeID/>
< script type =text / javascript>
var __ss_noform = __ss_noform || [];
__ss_noform.push(['baseURI','https://app-3QNAHNE212.marketingautomation.services/webforms/receivePostback/MzawMDEzMDcwBAA/']);
__ss_noform.push(['form','browserHangForm','$ SiteConfig.GatewayFormEmbedCodeID']);
__ss_noform.push(['submitType','manual']);
< / script>
< script type =text / javascript
src =https://koi-3QNAHNE212.marketingautomation.services/client/noform.js?ver=1.24>< / script>
<%end_if%>
< / div>
< / div>
< / div>

以下是处理表单动画的jQuery:

  jQuery.noConflict(); 

(函数($){

$(document).ready(function(){
//这个函数检查我们是否在移动视图中以确定表单的
// UI行为。

window.onload = checkWindowSize();

var arrowicon = $(。arrow);
var overlay = $(#overlay);
var slidingDiv = $(。slider);
var closeBtn = $(。closeBtn);
var mobileBtn = $(。mobile-btn);

//当页面加载时,检查屏幕尺寸
//如果屏幕尺寸小于768px,获得函数
//,该函数以屏幕中心的弹出形式打开表单
//否则,您希望它从右侧滑出动画
函数checkWindowSize (){
if($(window).width()< = 768){
//获取函数在屏幕中心打开表单
if(sessionStorage [PopupShown] !='是'){
setTim eout(formModal,5000);
函数formModal(){
slidingDiv.addClass(showForm)
overlay.addClass(showOverlay);
overlay.removeClass('hideOverlay');
mobileBtn.addClass(hideBtn);
}
}
}
else {
//当我们不在移动视图中时,让我们将表单从右边
滑出if(sessionStorage [PopupShown]!='yes'){
setTimeout(slideOut,5000);
function slideOut(){
slidingDiv.animate({'right':'-20px'})。addClass('open');
arrowicon.addClass(glyphicon-arrow-right);
arrowicon.removeClass(glyphicon-arrow-left);
overlay.addClass(showOverlay);
overlay.removeClass(hideOverlay);
}
}
}
}

/ *
---------------- --------------------------------------------
函数在移动视图中的屏幕中心打开/关闭表单模式
-------------------------------- ----------------------------
* /

mobileBtn.click(function(){
slidingDiv.addClass(showForm);
slidingDiv.removeClass(hideForm);
overlay.addClass(showOverlay);
overlay.removeClass('hideOverlay' );
mobileBtn.addClass(hideBtn);
});
closeBtn.click(function(){
slidingDiv.addClass(hideForm);
slidingDiv.removeClass(showForm);
overlay.removeClass(showOverlay) ;
overlay.addClass(hideOverlay)
mobileBtn.removeClass(hideBtn);
sessionStorage [PopupShown] ='yes'; //保存sessionStorage如果模态已被显示
});


/ *
-------------------------------- ----------------------------
将边栏窗体滑出/在
中的功能----- -------------------------------------------------- -----
* /
arrowicon.click(function(){
if(slidingDiv.hasClass('open')){
slidingDiv.animate({'right ':'-390px'})。removeClass('open');
arrowicon.addClass(glyphicon-arrow-left);
arrowicon.removeClass(glyphicon-arrow-right);
overlay.removeClass(showOverlay);
overlay.addClass(hideOverlay);
sessionStorage [PopupShown] ='yes'; //保存sessionStorage,如果模态已显示

} else {
slidingDiv.animate({'right':'-20px'})。addClass('open');
arrowicon.addClass( glyphicon-arrow-right);
arrowicon.removeClass(glyphicon-arrow-left);
overlay.addClass(showOverlay);
overlay.removeClass(hideOverlay);
}

});

});


}(jQuery));

AJAX / jQuery提交代码:

<$ (函数($){
$(document).ready(function(){
var FirstName = $('。FirstNameTxt');
var LastName = $('。LastNameTxt');
var EmailAddress = $('。EmailTxt');
var Company = $('。CompanyTxt');
var successMessage = $ ('.success');
var error = $('。errors-container');
var sharpSpringID = $('#gatewayEmbedID').val();
var submitbtn = $('。button-submit');
var SubmitProgress = $('img.progress');


函数validateForm(){
var required = (FirstName,LastName,EmailAddress,Company);
var containsErrors = false;
$ b $ for(i = 0; i< required.length; i ++){
var input =需要[i];
if((input.val()==)){
conta insErrors = true;
input.addClass('error-field');
error.show();
} else {
input.removeClass('error-field');
}
}

return!containsErrors;

submitbtn.click(函数(e){
var isValid = validateForm();
if(isValid){
postForm();
}
});

函数postForm(){
var formData = {
firstname:FirstName.val(),
lastname:LastName.val(),
useremail :EmailAddress.val(),
company:Company.val()
};

submitbtn.hide();
error.hide();
SubmitProgress.show();

$ .ajax({
type:POST,
url:/ home / submitGatewayForm,
data:formData,
dataType: ();
SubmitProgress.hide();
for(var i = 0; i();

})。done(function(response){
submitbtn.show < response.length; i ++){
var status = response [i] .status;
if(status ==error){
if(response [i] .field = =email){
error.show();
EmailAddress.addClass(error-field);
}
}
else if(status = ='success'){
__ss_noform.push(['submit',null,sharpSpringID]);

$('#browserHangForm')[0] .reset();
$('。form-field -content)隐藏();
successMessage.show();
$('。button-submit')。html(Submitted);
}
}
});
}
});
}(jQuery));

最后,服务器端在Page.php中形成处理代码:

  public function submitGatewayForm(){
$ firstname = $ this-> getRequest() - > postVar('firstname');
$ lastname = $ this-> getRequest() - > postVar('lastname');
$ emailfield = $ this-> getRequest() - > postVar('useremail');
$ company = $ this-> getRequest() - > postVar('company');

$ return = [];

if(!filter_var($ emailfield,FILTER_VALIDATE_EMAIL)){
$ validatonStatus =error;
$ errorField =email;
}

else {
$ gatewaysubmission = new GatewayFormSubmission();
$ gatewaysubmission-> FirstName = $ firstname;
$ gatewaysubmission-> LastName = $ lastname;
$ gatewaysubmission->电子邮件= $ emailfield;
$ gatewaysubmission->公司= $公司;
$ gatewaysubmission-> write();

$ validatonStatus =成功;
$ errorField =;

$ from ='[email]';
$ to ='[email]';
$ cc ='[email]';
$ subject ='网关表单提交';

$ body =下面是用户提交的表单信息:。< br />< br />;
$ body。=< strong> First Name:< / strong>。$ firstname。< br />。< strong> Last Name:< / strong>。 $ lastname。< br />。< strong>电子邮件:< / strong>。$ emailfield。< br />\".\"<strong>Company:</strong> 。$ company。< br />;

$ email = new电子邮件($ from,$ to,$ subject,$ body);
$ email-> setReplyto($ emailfield);
$ email-> setCc($ cc);
$ email-> send();

$ b $ return [] = array(
status=> $ validatonStatus,
field=> $ errorField,
);

返回json_encode($ return);
}


解决方案

cookie创建和管理,并决定走这条路。我在四个浏览器(Chrome,Safari,IE和FireFox)中测试了它,它似乎可行。



一旦表单成功提交,JS cookie就会创建:

 函数setCookie(cname,cvalue,exdays){
var d = new Date();
d.setTime(d.getTime()+(exdays * 24 * 60 * 60 * 1000));
var expires =expires =+ d.toGMTString();
document.cookie = cname +=+ cvalue +; + expires +; path = /;
$ .b
$ .ajax({
type:POST,
url:/ home / submitGatewayForm,
data:formData,
dataType:json,
))。done(function(response){
submitbtn.show();
SubmitProgress.hide();
for i = 0; i< response.length; i ++){
var status = response [i] .status;
if(status ==error){
if(response [ ();
EmailAddress.addClass(error-field);
}
}
else if(status ==success){
__ss_noform.push(['submit',null,sharpSpringID]);
//在提交表单时设置cookie
setCookie( 'ReceivedDownload','PdfSub',3650);
$('#browserH angForm)[0] .reset段();
$('。form-field-content')。hide();
successMessage.show();
$('。button-submit')。html(Submitted);
}
}
});

检查cookie是否存在以查看是否应自动打开模式:

 函数checkWindowSize(){
if($(window).width()<= 768){
// get函数在屏幕中心打开表单
if(sessionStorage [PopupShown]!='yes'&&!checkCookie()){
setTimeout(formModal,5000);
函数formModal(){
slidingDiv.addClass(showForm)
overlay.addClass(showOverlay);
overlay.removeClass('hideOverlay');
mobileBtn.addClass(hideBtn);
}
}
}
else {
//当我们不在移动视图中时,让我们将表单从右边
滑出if(sessionStorage [PopupShown]!='yes'&&!checkCookie()){
setTimeout(slideOut,5000);
function slideOut(){
slidingDiv.animate({'right':'-20px'})。addClass('open');
arrowicon.addClass(glyphicon-arrow-right);
arrowicon.removeClass(glyphicon-arrow-left);
overlay.addClass(showOverlay);
overlay.removeClass(hideOverlay);




$ b函数getCookie(cname){
var name = cname +=;
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);

if(c.indexOf(name)== 0){
return c.substring(name.length,c.length);
}
}
return;


函数checkCookie(){
var user = getCookie(ReceivedDownload);
if(user!=){
return true;
} else {
return false;
}
}


I have been working on a form that has 2 states: in desktop view, the form slides out from the right side of the screen after 5 seconds upon page load, then the user can click a button to close/open it. In mobile view, the form is triggered by a button and appears as a popup.

While building it, I didn't take into consideration that having the form automatically slide in or pop up on every single page would be an inconvenience. I have used HTML5 session storage to prevent the form from opening automatically on page load if the user has already closed the form.

Now the issue has come up that, if the user actually does fill out the form, the form should never automatically slide out or popup. I'm thinking this will involve somehow setting up a cookie upon the form's submission and maintaining that cookie every time said user visits the site. However, I'm not very familiar with cookies--it's definitely new territory for me as I've never done anything with them before.

As a sidenote, we have SharpSpring integration involved (i.e. the user fills out the form and their data is sent to a SharpSpring account for further marketing use and what not. Not sure if this is useful for my question or not.)

Here is the code for reference:

Bootstrap-style HTML form:

<div class="mobile-view" style="right: 51px;">
    <a class="mobile-btn">
        <span class="glyphicon glyphicon-arrow-left icon-arrow-mobile mobile-form-btn"></span>
    </a>
</div>
<div class="slider register-photo">
    <div class="form-inner">
        <div class="form-container">
            <form method="post" enctype="multipart/form-data" id="browserHangForm">
                <a class="sidebar">
                    <span class="glyphicon glyphicon-arrow-left icon-arrow arrow"></span>
                </a>
                <a class="closeBtn">
                    <span class="glyphicon glyphicon-remove"></span>
                </a>

                <h2 class="text-center black">Receive a free copy of so-and-so's book!
                </h2>

                <p class="light">-- Free Download --</p>

                <p class="errors-container light">Please fill in the required fields.</p>

                <div class="success">$SiteConfig.GatewayFormThankYou</div>
                <div class="form-field-content">
                    <div class="form-group">
                        <input class="form-control FirstNameTxt" type="text" name="first_name" placeholder="*First Name"
                               autofocus="">
                    </div>
                    <div class="form-group">
                        <input class="form-control LastNameTxt" type="text" name="last_name" placeholder="*Last Name"
                               autofocus="">
                    </div>
                    <div class="form-group">
                        <input class="form-control EmailTxt" type="email" name="Email" placeholder="*Email"
                               autofocus="">
                    </div>
                    <div class="form-group">
                        <input class="form-control CompanyTxt" type="text" name="Company" placeholder="*Company"
                               autofocus="">
                    </div>
                    <div class="form-group submit-button">
                        <button class="btn btn-primary btn-block button-submit" type="button">Send it to me</button>
                        <img src="/themes/simple/images/ajax-loader.gif" class="progress" alt="Submitting...">
                    </div>
                </div>
                <br/>

                <div class="privacy-link">
                    <a href="privacy-policy" class="already" target="_blank"><span
                            class="glyphicon glyphicon-lock icon-lock"></span>We will never share your information.</a>
                </div>
            </form>
            <% if $SiteConfig.GatewayFormEmbedCodeID %>
                <input type="hidden" id="gatewayEmbedID" value="$SiteConfig.GatewayFormEmbedCodeID" />
                <script type="text/javascript">
                    var __ss_noform = __ss_noform || [];
                    __ss_noform.push(['baseURI', 'https://app-3QNAHNE212.marketingautomation.services/webforms/receivePostback/MzawMDEzMDcwBAA/']);
                    __ss_noform.push(['form', 'browserHangForm', '$SiteConfig.GatewayFormEmbedCodeID']);
                    __ss_noform.push(['submitType', 'manual']);
                </script>
                <script type="text/javascript"
                        src="https://koi-3QNAHNE212.marketingautomation.services/client/noform.js?ver=1.24"></script>
            <% end_if %>
        </div>
    </div>
</div>

Here is the jQuery that handles the form animations:

jQuery.noConflict();

(function ($) {

    $(document).ready(function () {
//This function checks if we are in mobile view or not to determine the
//UI behavior of the form.

        window.onload = checkWindowSize();

        var arrowicon = $(".arrow");
        var overlay = $("#overlay");
        var slidingDiv = $(".slider");
        var closeBtn = $(".closeBtn");
        var mobileBtn = $(".mobile-btn");

//When the page loads, check the screen size.
//If the screen size is less than 768px, you want to get the function
//that opens the form as a popup in the center of the screen
//Otherwise, you want it to be a slide-out animation from the right side
        function checkWindowSize() {
            if ($(window).width() <= 768) {
                //get function to open form at center of screen
                if(sessionStorage["PopupShown"] != 'yes'){
                    setTimeout(formModal, 5000);
                    function formModal() {
                        slidingDiv.addClass("showForm")
                        overlay.addClass("showOverlay");
                        overlay.removeClass('hideOverlay');
                        mobileBtn.addClass("hideBtn");
                    }
                }
            }
            else {
                //when we aren't in mobile view, let's just have the form slide out from the right
                if(sessionStorage["PopupShown"] != 'yes'){
                    setTimeout(slideOut, 5000);
                    function slideOut() {
                        slidingDiv.animate({'right': '-20px'}).addClass('open');
                        arrowicon.addClass("glyphicon-arrow-right");
                        arrowicon.removeClass("glyphicon-arrow-left");
                        overlay.addClass("showOverlay");
                        overlay.removeClass("hideOverlay");
                    }
                }
            }
        }

        /*
         ------------------------------------------------------------
         Functions to open/close form like a modal in center of screen in mobile view
         ------------------------------------------------------------
         */

        mobileBtn.click(function () {
            slidingDiv.addClass("showForm");
            slidingDiv.removeClass("hideForm");
            overlay.addClass("showOverlay");
            overlay.removeClass('hideOverlay');
            mobileBtn.addClass("hideBtn");
        });
        closeBtn.click(function () {
            slidingDiv.addClass("hideForm");
            slidingDiv.removeClass("showForm");
            overlay.removeClass("showOverlay");
            overlay.addClass("hideOverlay")
            mobileBtn.removeClass("hideBtn");
            sessionStorage["PopupShown"] = 'yes'; //Save in the sessionStorage if the modal has been shown
        });


        /*
         ------------------------------------------------------------
         Function to slide the sidebar form out/in
         ------------------------------------------------------------
         */
        arrowicon.click(function () {
            if (slidingDiv.hasClass('open')) {
                slidingDiv.animate({'right': '-390px'}).removeClass('open');
                arrowicon.addClass("glyphicon-arrow-left");
                arrowicon.removeClass("glyphicon-arrow-right");
                overlay.removeClass("showOverlay");
                overlay.addClass("hideOverlay");
                sessionStorage["PopupShown"] = 'yes'; //Save in the sessionStorage if the modal has been shown

            } else {
                slidingDiv.animate({'right': '-20px'}).addClass('open');
                arrowicon.addClass("glyphicon-arrow-right");
                arrowicon.removeClass("glyphicon-arrow-left");
                overlay.addClass("showOverlay");
                overlay.removeClass("hideOverlay");
            }

        });

    });


}(jQuery));

The AJAX/jQuery submit code:

;(function ($) {
    $(document).ready(function () {
        var FirstName = $('.FirstNameTxt');
        var LastName = $('.LastNameTxt');
        var EmailAddress = $('.EmailTxt');
        var Company = $('.CompanyTxt');
        var successMessage = $('.success');
        var error = $('.errors-container');
        var sharpSpringID = $('#gatewayEmbedID').val();
        var submitbtn = $('.button-submit');
        var SubmitProgress = $('img.progress');


        function validateForm() {
            var required = [FirstName, LastName , EmailAddress, Company];
            var containsErrors = false;

            for (i = 0; i < required.length; i++) {
                var input = required[i];
                if ((input.val() == "")) {
                    containsErrors = true;
                    input.addClass('error-field');
                    error.show();
                } else {
                    input.removeClass('error-field');
                }
            }

            return !containsErrors;
        }
        submitbtn.click(function(e) {
            var isValid = validateForm();
            if (isValid) {
                postForm();
            }
        });

        function postForm() {
            var formData = {
                firstname: FirstName.val(),
                lastname: LastName.val(),
                useremail: EmailAddress.val(),
                company: Company.val()
            };

            submitbtn.hide();
            error.hide();
            SubmitProgress.show();

            $.ajax({
                type: "POST",
                url: "/home/submitGatewayForm",
                data: formData,
                dataType: "json",
            }).done(function (response) {
                submitbtn.show();
                SubmitProgress.hide();
                for (var i = 0; i < response.length; i++) {
                    var status = response[i].status;
                    if (status == "error") {
                       if (response[i].field == "email") {
                            error.show();
                            EmailAddress.addClass("error-field");
                       }
                    }
                    else if (status == "success") {
                        __ss_noform.push(['submit', null, sharpSpringID]);

                        $('#browserHangForm')[0].reset();
                        $('.form-field-content').hide();
                        successMessage.show();
                        $('.button-submit').html("Submitted");
                    }
                }
            });
        }
    });
}(jQuery));

And lastly, the server side form processing code in Page.php:

public function submitGatewayForm() {
    $firstname = $this->getRequest()->postVar('firstname');
    $lastname  = $this->getRequest()->postVar('lastname');
    $emailfield     = $this->getRequest()->postVar('useremail');
    $company   = $this->getRequest()->postVar('company');

    $return = [];

    if (!filter_var($emailfield, FILTER_VALIDATE_EMAIL)) {
        $validatonStatus = "error";
        $errorField = "email";
    }

    else {
        $gatewaysubmission = new GatewayFormSubmission();
        $gatewaysubmission->FirstName = $firstname;
        $gatewaysubmission->LastName = $lastname;
        $gatewaysubmission->Email = $emailfield;
        $gatewaysubmission->Company = $company;
        $gatewaysubmission->write();

        $validatonStatus = "success";
        $errorField = "";

        $from = '[email]';
        $to = '[email]';
        $cc = '[email]';
        $subject = 'Gateway Form Submission';

        $body ="Below is the form information submitted by the user:"."<br /><br />";
        $body .= "<strong>First Name:</strong> ".$firstname."<br/>"."<strong>Last Name:</strong> ".$lastname."<br/>"."<strong>Email:</strong> ".$emailfield."<br />"."<strong>Company:</strong> ".$company."<br />";

        $email = new Email($from, $to, $subject, $body);
        $email->setReplyto($emailfield);
        $email->setCc($cc);
        $email->send();

    }
    $return[] = array(
        "status" => $validatonStatus,
        "field" => $errorField,
    );

    return json_encode($return);
}

解决方案

I found some posts on JavaScript cookie creation and management and decided to go that route. I tested it in four browsers (Chrome, Safari, IE, and FireFox) and it seems to work.

Once the form is successfully submitted, the JS cookie is created:

 function setCookie(cname,cvalue,exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

  $.ajax({
            type: "POST",
            url: "/home/submitGatewayForm",
            data: formData,
            dataType: "json",
        }).done(function (response) {
            submitbtn.show();
            SubmitProgress.hide();
            for (var i = 0; i < response.length; i++) {
                var status = response[i].status;
                if (status == "error") {
                   if (response[i].field == "email") {
                        error.show();
                        EmailAddress.addClass("error-field");
                   }
                }
                else if (status == "success") {
                    __ss_noform.push(['submit', null, sharpSpringID]);
                    //set cookie when the form has been submitted
                    setCookie('ReceivedDownload','PdfSub', 3650);
                    $('#browserHangForm')[0].reset();
                    $('.form-field-content').hide();
                    successMessage.show();
                    $('.button-submit').html("Submitted");
                }
            }
        });

Check if the cookie exists to see if the modal should be automatically opened:

function checkWindowSize() {
        if ($(window).width() <= 768) {
            //get function to open form at center of screen
            if(sessionStorage["PopupShown"] != 'yes' && !checkCookie()){
                setTimeout(formModal, 5000);
                function formModal() {
                    slidingDiv.addClass("showForm")
                    overlay.addClass("showOverlay");
                    overlay.removeClass('hideOverlay');
                    mobileBtn.addClass("hideBtn");
                }
            }
        }
        else {
            //when we aren't in mobile view, let's just have the form slide out from the right
            if(sessionStorage["PopupShown"] != 'yes' && !checkCookie()){
                setTimeout(slideOut, 5000);
                function slideOut() {
                    slidingDiv.animate({'right': '-20px'}).addClass('open');
                    arrowicon.addClass("glyphicon-arrow-right");
                    arrowicon.removeClass("glyphicon-arrow-left");
                    overlay.addClass("showOverlay");
                    overlay.removeClass("hideOverlay");
                }
            }
        }
    }

    function getCookie(cname) {
        var name = cname + "=";
        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);
            }
            if (c.indexOf(name) == 0) {
                return c.substring(name.length, c.length);
            }
        }
        return "";
    }

    function checkCookie() {
        var user = getCookie("ReceivedDownload");
        if (user != "") {
           return true;
        } else {
            return false;
        }
    }

这篇关于Silverstripe / PHP / jQuery - 一旦表单被用户填写,防止它自动出现在每次访问的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆