1

如果在 Ajax 和 JQuery 和 PHP 的帮助下 MySQL 中没有该用户名，是否可以更改文本框的边框颜色？我在网上搜索了很多，但我得到的只是如何使用 Ajax 更改 div 的 innerHTML，如果我想显示 Tick 或 Cross 图像，这很有用。请帮忙

4

6 回答 6

2

像下面那样进行 ajax 调用，并使用 formdata 传递用户名并检查数据库。如果您无法从数据库中获取用户名，则发送标志“false”作为响应。

$.ajax({
            type: "POST",
            url: "your_url to post",
            data: formdata,
            dataType: 'json',
            success: function (msg) {
                 if(msg=='false')
                     $('#tbxControl').attr('style','border:1px solid #000');
            }
});
于 2013-07-04T11:20:36.083 回答
0

对我有用的解决方案:)

HTML

<input type="text" name="eMailTxt" id="eMailTxt" class="texttt" placeholder="Email Address" onChange="showUser(this.value)" />

AJAX

function showUser(str)
{
    if (str=="")
    {
        $('#eMailTxt').css({'border':'blue 2px solid'});
    }
    if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                if (xmlhttp.responseText=="false")
                {
                    $("#eMailTxt").css({'border':'red 2px solid'});
                }
                else
                {
                    $("#eMailTxt").css({'border':'green 2px solid'});
                }
            }
        }
    xmlhttp.open("GET","login.php?q="+str,true);
    xmlhttp.send();

}

PHP

<?php
    $q=$_GET["q"];
    $con=mysqli_connect("localhost","root","","my_db");
    $check="SELECT Email FROM persons WHERE EMAIL = '".$q."'";
    $data=mysqli_query($con,$check);
    $result=mysqli_fetch_array($data);
    if ($result[0]==$q)
    {
        echo "true";
    }
    else
    {
        echo "false";
    }
?>
于 2013-07-04T12:03:04.777 回答
0
  1. Check jQuery documentation "how to change style of element"
  2. Check jQuery documentation "how to send ajax request"
  3. Combine 1) and 2): send a request that checks username, in callback function adapt style of element
于 2013-07-04T11:10:23.243 回答
0

你可以创建一个错误的用户名类

.badUsername{
Border-colour: <colour of your choice>
}

然后在 ajax 成功或失败函数中，您可以将此类应用于文本框

$(#<TextboxID>).addClass(badUsername);

（也可以使用 removeClass 或 hasClass 对元素进行检查）

另一种选择是直接在成功或失败函数中调整样式

$(#<TextboxID>).css(“border-colour: <colour of your choice>;”);
于 2013-07-04T12:05:59.980 回答
0

看看这个教程。

如果你去Jquery 部分，在第 40 行之后，你只需要添加：

$('#username').css({border: "1px solid red"});

希望能帮助到你！
干杯

于 2013-07-04T11:35:08.607 回答
0

这很容易。您可以根据 ajax 响应更改边框；要更改边框，请在 jQuery 对象上使用 css 方法。

示例：http: //jsfiddle.net/mCk6z/

jQuery(function(){
    $('#username').css({'border': '1px solid #000'});

});
于 2013-07-04T11:14:58.357 回答