修改WordPress登录页面的问题


Problems with modifying the WordPress login page

所以我再次修改登录页面。。。我遇到了另一个问题。以下是场景。。。我有一个插件,它由两个组件组成:一个脚本重写登录/注册表单上的username字段,另一个函数重写注册时的验证处理程序。

以下是有问题的文件。。。

validator.php

<?php
// Rewrite registration form
function mpm_registration_form() {
    wp_enqueue_script('login_form', plugin_dir_url(__FILE__).'js/usernamerewrite.js', array('jquery'), false, false);
}
add_action('login_head', 'mpm_registration_form');
// Register actions
add_action('register_post', 'mpm_validator_verify_account', 10, 3);
// Check username against minecraft.net database
function mpm_validator_verify_account($login, $email, $errors) {
    $curl = curl_init();
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($curl, CURLOPT_URL, 'http://www.minecraft.net/haspaid.jsp?user='.rawurlencode($login));
    $mcacct = curl_exec($curl);
    curl_close($curl);
    if($mcacct != 'true') {
        if($mcacct == 'false') {
            $errors->add('mc_error', __('<strong>Error:</strong> Minecraft account is invalid.'));
            return $errors;
        } else {
            $errors->add('mc_error', __('<strong>Error:</strong> Unable to contact minecraft.net.'));
            return $errors;
        }
        add_filter('registration_errors', 'mpm_validator_verify_account', 10, 3);
    }
}

js/usernamerewrite.js

jQuery(document).ready(function ($) {
    'use strict';
    /*global document: false */
    /*global $, jQuery */
    var username, reset;
    if ($('body').hasClass('login')) {
        username = document.createElement("input");
        username.type = 'text';
        username.name = 'log';
        username.id = 'user_login';
        username.className = 'input';
        username.size = '20';
        username.tabIndex = '10';
        reset = document.createElement("input");
        reset.type = 'text';
        reset.name = 'user_login';
        reset.id = 'user_login';
        reset.className = 'input';
        reset.size = '20';
        reset.tabIndex = '10';
        $('label').each(
            function () {
                if ($(this).text().trim() === 'Username') {
                    $(this).html('Minecraft Username<br/>');
                    $(this).append(username);
                } else if ($(this).text().trim() === 'Username or E-mail:') {
                    $(this).html('Minecraft Username or E-mail:<br/>');
                    $(this).append(reset);
                }
            }
        );
    }
});

问题是,如果我按照当前的状态编写wp_enque_script行(在头中加载脚本),那么操作函数会得到正确处理,但重写永远不会发生。相反,如果我更改它,使脚本加载在页脚中,则会发生重写,但操作不再得到正确处理(用户名字段在提交之前重置)。我完全不知所措。

第二个(小)烦恼:页面加载和重写之间总是有一个轻微的延迟。任何关于如何使其更加透明的想法都将不胜感激。

编辑:如果你要投票否决这个问题,你至少可以指出原因。。。

终于想通了!我做这件事的方式太可怕了。。。我真的需要复习一下我的JS/jQuery。这是我最终得到的,它在我所有的测试用例中都能很好地工作,而且不仅可以重写字段标签,还可以重写消息。。。

jQuery(document).ready(function ($) {
'use strict';
/*global document: false */
/*global $, jQuery */
    $('label').each(
        function () {
            $(this).html($(this).html().replace('Username', 'Minecraft Username'));
        }
    );
    $('.message').each(
        function () {
            $(this).html($(this).html().replace('username', 'Minecraft username'));
        }
    );
});

你能把你的函数包装在中吗

jQuery( document ).ready
(
   function( $ )
   {
        // your js here
   }
);

无需将(jQuery)放在函数后面。

如果在页面加载之前运行DOM修改,它将无法工作。您现在可以将其加载到标头中,并确保它会开火。

我不太明白为什么在提交之前会重置字段,因为你没有绑定到任何提交事件处理程序。。。如果这种情况仍然存在,请告诉我们。

如果你在登录页面上,而不是将这个js发送到你网站上的所有页面,你可能想签入php(使用login_head操作),而不是在你的js中调用if ($('body').hasClass('login'))。但在优化之前先让它发挥作用。

如果提交没有到达后端,那可能是因为您的javascript使用与wordpress输入相同的ID重新创建输入,从而替换它们。据我所知,这根本不是你想要的。只需替换现有标签。