首页 > 解决方案 > 为 wordpress 设置 maskedinput

问题描述

你好,我在 WordPress 上做网站,我需要在结帐页面上设置电话掩码。 我从GitHub获得了文件 jquery.maskedinput.min.js并在途中将其上传到主机上:

wp-content/themes/woodmart-child/js/

然后我在子主题的function.php中添加了脚本:

add_action('wp_enqueue_scripts', 'my_maskedinput', 10);
function my_maskedinput() {
    if (is_checkout()) {
        wp_enqueue_script('maskedinput', '/wp-content/themes/woodmart-child/js/jquery.maskedinput.min.js', array('jquery'));
        add_action( 'wp_footer', 'masked_script', 999);
    }
}
 function masked_script() {
    if ( wp_script_is( 'jquery', 'done' ) ) {
?>
    <script type="text/javascript">
        jQuery( function( $ ) {
            $("#billing_phone").mask("+7(999)999-99-99");
        });
    </script>
<?php
    }
}

但是结帐页面上没有显示电话掩码。我检查了 DevTools,代码

<script type="text/javascript">
    jQuery( function( $ ) {
        $("#billing_phone").mask("+7(999)999-99-99");
    });
</script>

在 html 文件中添加。但是错误在哪里?我做错了什么?

upd:我尝试通过 str_replace 实现它(它也不起作用):

add_filter( 'woocommerce_form_field', 'my_maskedinput', 20, 4 );
function my_maskedinput( $field, $key, $args, $value ) {
    // Only on checkout page
    if( is_checkout() && ! is_wc_endpoint_url() ) {
        $phone = '&nbsp;<input type="tel" class="input-text " name="billing_phone" id="billing_phone" placeholder="Номер телефона" value autocomplete="tel">';
        $field = str_replace( $phone, '&nbsp;<input type="tel" class="input-text" name="billing_phone" id="billing_phone" placeholder="Номер телефона" value autocomplete="tel" mask="+7 (999) 999-99-99">', $field );
    }
    
    return $field;
}

标签: phpwordpressmaskedinput

解决方案


我检查文件 jquery.maskedinput.min.js 并且它不包含正确的脚本。我从这里得到文件并将其上传到主机上。然后它工作!


推荐阅读