我想阻止用户在内容锁定时与用户进行互动。是的

时间:2015-10-06 18:09:35

标签: javascript jquery html css wordpress

我在wordpress中构建自定义主题(请不要插件建议,我最大容量)并设置锁定所有内容的位置,直到有人输入他们的名字/或电子邮件。

现在,页面加载后立即加载内容锁定(右侧模糊侧边栏和主要内容区域)。 但是,一切都很模糊,但按钮和锁定div下的所有东西都是可用的。

显然需要预防这一点。



    <?php
    class Languages
    {
        public $active = [];
        public $data;

        function __construct() {
            /** This will run first before anything else. **/

            $this->active["someKey"] = "someValue";
            $this->data = '<div class="menu">
                            <ul>
                                <li class=' . $this->$active["en"] . '>English</li>
                                <li class=' . $this->$active["fr"] . '>French</li>
                            </ul>
                        </div>';
        }

        function English()
        {
            // other codes
            $this->active["en"] = 'active';
            return $active;
        }

        function French()
        {
            // other codes
            $this->active["fr"] = 'active';
            return $active;
        }

    }
    ?>
&#13;
&#13;
&#13;

在使用输入信息之前,有些HTML元素需要完全不可用。例如,&#39; .btn&#39;在下面,单击时,将加载未输入信息的用户不应看到的内容。

这里最好的做法是什么?

&#13;
&#13;
jQuery(document).ready(function ($) {

	
	var imagecontent = $('.image-content');
    var textcontent= $('.text-content');
    var header = $('h2');

    imagecontent.addClass('content-blurred');
    textcontent.addClass('content-blurred');
    header.addClass('content-blurred');
    body.addClass('content-locked');

    // to show the 'enter-details' modal //

    var unlockModal = $("#unlock-modal");
    var lockblock= $(".lockblock");
    var lockblock2= $(".lockblock2");
    var pagelock=$(".pagelock");
    var enterdetails= $('#enter-details');

    pagelock.click(function(){
        unlockModal.modal('show');
  });
    
    function setupUnlockForm() {
    var unlockForm = $('.unlock-form');
    var rules = {
            email: {
                required: true,
                email: true
            }
        };
        var subscriptionForm = wp.template.subscriptionForm;
        if (subscriptionForm && subscriptionForm.firstNameKey) {
            rules['firstName'] = {
                required: true
            };
        } else {
            unlockForm.find('[name=firstName]').hide();
        }
        if (subscriptionForm && subscriptionForm.lastNameKey) {
            rules['lastName'] = {
                required: true
            };
        } else {
            unlockForm.find('[name=lastName]').hide();
        }

        unlockForm.on('submit', function (event) {
            var form = $(this);
            form.addClass('disabled');
            event.preventDefault();
        }).each(function () {
            var form = $(this);
            form.validate({
                rules: rules,
                submitHandler: function () {
                    var email = form.find('[name=email]').val();
                    var firstName = form.find('[name=firstName]').val();
                    var lastName = form.find('[name=lastName]').val();
                    unlockModal.modal('hide');
                    body.removeClass('content-locked');
                    return false;
                },
                invalidHandler: function () {
                    form.removeClass('disabled');
                }
            });
        });
    }
    });
&#13;
&#13;
&#13;

0 个答案:

没有答案