- 下载ADB工具
text
下载地址：https://dl.google.com/android/repository/platform-tools-latest-windows.zip
解压到：C:\adb\
-
手机设置（魅族）
text -
设置 → 关于手机 → 版本号（点7次开启开发者模式）
-
返回 → 系统更新 → 开发者选项
-
开启：USB调试
-
开启：USB调试（安全设置）
二、连接步骤（每次调试）
步骤1：连接USB
bash
打开命令行（Win+R，输入cmd）
cd C:\adb
adb devices
如果显示 unauthorized → 手机上点击"允许USB调试"
步骤2：端口转发
bash
adb forward tcp:9222 localabstract:chrome_devtools_remote
步骤3：打开调试页面
电脑打开 Chrome浏览器
地址栏输入：chrome://inspect/#devices
点击 "Port forwarding..."
勾选 "Enable port forwarding"
添加：9222 → localhost:9222步骤4：手机操作
用魅族浏览器打开你的网页
回到电脑 chrome://inspect 页面
应该能看到你的网页，点击 "inspect"三、常见问题解决
问题1：adb devices 没反应
text
解决：
- 换USB线（要能传输数据）
- 换USB口（用电脑后面的USB口）
- 手机下拉通知栏 → USB连接方式 → 选择"传输文件"
问题2：device offline
bash
执行：
adb kill-server
adb start-server
然后：
- 拔掉USB线
- 手机：开发者选项 → 撤销USB调试授权
- 重新连接USB
问题3：chrome://inspect 看不到页面
bash
检查端口转发
adb forward --list
尝试其他端口
adb forward tcp:9223 localabstract:chrome_devtools_remote
adb forward tcp:9224 localabstract:chrome_devtools_remote
四、快捷脚本
在 C:\adb\ 创建 debug.bat：
batch
@echo off
cd /d "%~dp0"
echo 1. 检查连接
adb devices
echo.
echo 2. 开启端口转发
adb forward tcp:9222 localabstract:chrome_devtools_remote
echo.
echo 3. 请访问 chrome://inspect
pause
五、调试技巧
实时修改CSS：在Elements面板修改样式
查看Console：查看JavaScript错误
模拟设备：DevTools → 切换设备工具栏
屏幕截图：DevTools → 三个点 → Capture screenshot六、如果ADB还是不行
用这个方法验证键盘问题：
bash
直接在手机上创建测试页面
adb shell "echo '<input style=\"position:fixed;bottom:0\">' > /sdcard/test.html"
在手机浏览器打开
adb shell am start -a android.intent.action.VIEW -d "file:///sdcard/test.html"
最简单的测试：直接在手机浏览器访问这个：
text
data:text/html,
总结步骤：
下载ADB到 C:\adb\
手机开USB调试
电脑运行：adb forward tcp:9222 localabstract:chrome_devtools_remote
电脑Chrome访问：chrome://inspect
手机浏览器打开你的网页