我在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;
在使用输入信息之前,有些HTML元素需要完全不可用。例如,&#39; .btn&#39;在下面,单击时,将加载未输入信息的用户不应看到的内容。
这里最好的做法是什么?
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;