如果移动验证状态发生变化，如何将颜色从红色变为绿色？答案

【问题标题】：How to change color from red to green if mobile verification status changes?如果移动验证状态发生变化，如何将颜色从红色变为绿色？
【发布时间】：2026-01-16 08:00:01
【问题描述】：

我目前正在开发一个项目（基于 Django），该项目有一个用户配置文件，用户可以在其中验证他们的手机号码。我为此使用 Twilio。

我想要的是，当用户查看他们的个人资料时，手机号码字段正下方应该有一个“验证您的手机号码”选项，该选项将显示为红色。一旦用户验证了这一点（通过一些后端 Django/python 的东西）并再次返回到个人资料页面，该消息应该是“已验证”（绿色）。

我想要 CSS 和 JavaScript 代码来实现这一点，因为对于 SMS 验证和所有后端的东西我已经有了代码。

我们将不胜感激。

【问题讨论】：

标签： javascript python css django twilio

【解决方案1】：

这是通过 AJAX 完成的，步骤如下

创建一个检查用户状态的新视图，例如 is_verified_user 并返回 True/False

编写一个调用视图并检查响应的JS函数，应该是这样的

 function check_user_status(){
         $.ajax({"url":"{%url 'is_verified_user'%}", success:function(data){
         if (data == "True")
              {     //change the colors}
         else
               setTimeout("check_user_status",3000)
             // Check again in 3 seconds
        }
        })
     }

一旦用户点击“验证您的手机号码”，调用check_user_status函数开始检查。

P.S 你需要 JQuery。

【讨论】：

【解决方案2】：

检查api响应并使用三元运算符

React JS 中的示例

const [state, setState] = useState(false)

使用效果（（）=> { //调用api

让响应 = axios.get('/')

让结果 = response.verified ?真：假

设置状态（结果）

},[状态])

返回（

)

【讨论】：