本文将介绍如何使用PHP和JavaScript处理表单中的手机号码输入，实现自动过滤非10位数字的号码，并实时统计有效号码数量的功能。通过结合前端的JavaScript脚本和后端的PHP处理，可以有效地清洗用户输入的手机号码数据，并为用户提供清晰的号码统计信息。
前端实现：JavaScript 过滤和计数
前端部分的核心在于使用 JavaScript 实时处理用户在 textarea 中输入的手机号码。主要功能包括：
- 监听 mouseout 事件: 当鼠标移出文本框时触发号码处理。
- 获取并清洗数据: 从 textarea 中获取所有号码，去除首尾空格，并按行分割。
- 验证号码: 循环遍历每个号码，只保留10位数字的号码。
- 更新 textarea 和计数器: 将过滤后的号码重新填充到 textarea 中，并更新号码计数器的值。
以下是实现该功能的 JavaScript 代码：
代码解释:
立即学习“PHP免费学习笔记（深入）”；
- numbers = document.querySelector('#mobileno'); 和 numbercount = document.querySelector('#numbercount');：分别获取 textarea 和计数器输入框的 DOM 元素。
- numbers.addEventListener('mouseout', getNumbers);: 监听 textarea 的 mouseout 事件，当鼠标移出时触发 getNumbers 函数。
- getNumbers(event): 事件处理函数，用于处理号码数据。
- event.preventDefault();：阻止默认事件行为。
- getnums = numbers.value.trim();：获取 textarea 中的值，并去除首尾空格。
- getnums = getnums.split("\n");：将字符串按行分割成数组。
- num.length === 10 && num.indexOf("+") === -1 && /^\d+$/.test(num)：确保号码长度为10，不包含 "+" 符号，并且是纯数字。
- result += num.substring(0, 10) + "\n";: 将有效的号码添加到结果字符串中，并添加换行符。
- numbers.value = result;: 将结果字符串填充回 textarea。
- numbercount.value = totalNum;: 更新计数器的值。
HTML 表单结构
以下是 HTML 表单的基本结构，包含一个 textarea 用于输入手机号码，一个只读的 input 框用于显示号码数量，以及一个提交按钮。
迅易年度企业管理系统开源完整版
下载
系统功能强大、操作便捷并具有高度延续开发的内容与知识管理系统，并可集合系统强大的新闻、产品、下载、人才、留言、搜索引擎优化、等功能模块，为企业部门提供一个简单、易用、开放、可扩展的企业信息门户平台或电子商务运行平台。开发人员为脆弱页面专门设计了防刷新系统，自动阻止恶意访问和攻击；安全检查应用于每一处代码中，每个提交到系统查询语句中的变量都经过过滤，可自动屏蔽恶意攻击代码，从而全面防止SQL注入攻击
注意：
- id="mobileno" 和 id="numbercount" 必须与 JavaScript 代码中的选择器一致。
- 确保 textarea 具有 name 属性，以便在后端 PHP 代码中获取数据。
后端处理：PHP 接收和验证 (可选)
虽然前端已经进行了过滤，但在后端使用 PHP 再次验证数据仍然是一个好习惯，可以防止恶意用户绕过前端验证。
";
foreach ($validNumbers as $validNumber) {
echo $validNumber . "
";
}
}
?>代码解释:
立即学习“PHP免费学习笔记（深入）”；
- $_SERVER["REQUEST_METHOD"] == "POST"：检查请求方法是否为 POST。
- $_POST["mobileno"]：获取 textarea 中的值。
- explode("\n", $mobileNumbers)：将字符串按行分割成数组。
- strlen($number) == 10 && ctype_digit($number)：确保号码长度为10，并且是纯数字。
- $validNumbers[] = $number;：将有效的号码添加到 $validNumbers 数组中。
总结
通过结合前端 JavaScript 的实时过滤和计数，以及后端 PHP 的再次验证，可以有效地处理表单中的手机号码输入，确保数据的准确性和安全性。 这种方法既能提升用户体验，又能保证数据的质量，适用于需要收集大量手机号码的场景。
