如何在###-####-###中设置联系表格7电话号码格式答案

【问题标题】：How to set the contact form 7 phone number format in ###-####-###如何在###-####-###中设置联系表格7电话号码格式
【发布时间】：2020-10-23 00:45:04
【问题描述】：

我正在使用联系表格 7，我想知道当用户输入格式为###-####-### 时，是否有办法设置电话号码，默认情况下，提前致谢

【问题讨论】：

标签： javascript jquery contact-form-7

【解决方案1】：

2019 年更新，因为 Masked Input Plugin 不会更新：

按照以下步骤操作：

1) 下载Cleave.js;

2) 打开你的主题 javascript 文件夹（例如，Twentyseventeen）并将文件放入 wp-content/themes/twentyseventeen/js；

3) 打开functions.php 文件（位于您主题的根文件夹中）并将代码粘贴到它的底部：

//Enqueue Cleave.js

function enqueue_cleave(){
     wp_enqueue_script('cleave', get_stylesheet_directory_uri().'/js/cleave.min.js');
}
add_action('wp_enqueue_scripts', 'enqueue_cleave'); 

add_action('wp_footer', 'activate_cleave');

function activate_cleave(){
   if( is_page('contact') ){ //only contact page will load the script.
?>

     <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', () => {
        var phone = new Cleave('#phone', {
            numericOnly:true,
            delimiter:'-',
            blocks:[3,4,3]
        });
    });

     </script>

<?php 
   }
}

5) 在 Contact Form 7 中创建一个输入字段（id:phone 将用于 Cleave.js）：

[text phone id:phone placeholder "Your phone number here."]

6) 创建一个名为“联系人”的页面并将您的表单放入其中。

就是这样。

【讨论】：

【解决方案2】：

下载Contact Form 7 – Phone mask field plugin.
您可以使用这种格式：

[mask* fieldname id:tel "___-____-___"]

【讨论】：