如何创建一个警告对话框,要求用户使用js订阅我的网站?

时间:2016-07-05 12:23:47

标签: javascript cookies

如果有人在我的网站上,我希望我的网站显示提醒或确认提示,要求用户订阅我的邮件列表。我想短暂但不立即显示消息,有ok选项将用户引导到订阅页面,其他两个选项(我已经订阅,解雇)

当他们解雇该选项时,我希望我的网站在他们的计算机上留下一个cookie 7天。当cookie处于活动状态时,提示不会显示。如果用户点击(我已订阅),我希望cookie永远持续。

订阅页面是否可以保留非过期cookie以禁用订阅提示?如果cookie只与他们发送的网址一起使用,我确实有“我已经订阅”选项

这是我要解决的问题的流程图的image

1 个答案:

答案 0 :(得分:0)

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script type="text/javascript">
        $(function () {
            setTimeout(function () {
                $('#subscribeModal').modal('show');
            }, 5000);

            $("#btnRegister").click(function () {
                var email = $("#txtEmailAddress").val();
                alert("Handle the subscription logic for - " + email);
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="subscribeModal" class="modal fade" aria-labelledby="myModalLabel">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Subscribe To My Site</h4>
                    </div>
                    <div class="modal-body">
                        Your email address
                        <input type="email" id="txtEmailAddress">
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary" id="btnRegister">Subscribe</button>
                    </div>

                </div>
            </div>
        </div>
    </form>
</body>
</html>