[PHP/AJAX]：根據輸入的文字改變信息的顏色

在我的網站首頁，我有一個新的用戶註冊表單。它包含一個字段「用戶名」。當用戶輸入用戶名並且焦點指向另一個字段時，會執行一個AJAX代碼，用於檢查是否有用戶輸入的用戶名已經存在或不存在。[PHP/AJAX]：根據輸入的文字改變信息的顏色

，我使用Ajax代碼是這樣的：

function toggle_username(userid) { 
    if (window.XMLHttpRequest) { 
     http = new XMLHttpRequest(); 
    } else if (window.ActiveXObject) { 
     http = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    handle = document.getElementById(userid); 
    var url = 'ajax.php?'; 
    if(handle.value.length > 0) { 
     var fullurl = url + 'do=check_username_exists&username=' + encodeURIComponent(handle.value); 
     http.open("GET", fullurl, true); 
     http.send(null); 
     http.onreadystatechange = statechange_username; 
    } 
    else 
    { 
     document.getElementById('username_exists').innerHTML = ''; 
    } 
}

文件「AJAX.PHP」通過上面的代碼中調用，是這樣的：

<?php 
mysql_connect ('localhost', 'MyServer', 'user1'); 
mysql_select_db('globaldb'); 

$do = $_GET['do']; 
switch($do) { 
    case 'check_username_exists': 
     if(get_magic_quotes_gpc()) { 
      $username = $_GET['username']; 
     }else{ 
      $username = addslashes($_GET['username']); 
     } 
     $count = mysql_num_rows(mysql_query("SELECT * FROM `student_login` WHERE `username`='".$username."'")); 
     header('Content-Type: text/xml'); 
     header('Pragma: no-cache'); 
     echo '<?xml version="1.0" encoding="UTF-8"?>'; 
     echo '<result>'; 
     if($count > 0) { 
      $_SESSION['UserExists'] = "true"; 

     }else{ 
      $_SESSION['UserExists'] = "false"; 
     } 
     $_SESSION['UserExists'] = "false"; 
     echo '</result>'; 
    break; 
    default: 
     echo 'Error, invalid action'; 
    break; 
} 
?>

在我的登記表，正好在用戶名輸入框下面，我想定義一個區域，我可以在其中顯示消息：

存在此用戶名的用戶或

用戶名可用。

在我的主頁，我使用下面的代碼：

<input name="username" type="text" id="username" onchange="toggle_username('username')" style="width:150px;" maxlength="40" size="22" > 

<?PHP 

    if ($_SESSION['UserExists'] == "true") 
    { 
    echo "<div id='username_exists' style='font-size: 11px;font-weight: bold;color:red'>User with this name unavailable.</div>"; 
    } 
    else 
    { 
     echo "<div id='username_exists' style='font-size: 11px;font-weight: bold;color:darkgreen'> User with this name is available </div>"; 
    } 
?>

主頁由上面的代碼和第一代碼塊（JavaScript）的頂部是我給的。

此代碼無法使用。我猜想原因是我已經在PHP塊中包含了這些消息。作爲服務器端，它沒有顯示消息。

請讓我知道如何處理這個問題。是否修改調用AJAX的JavaScript代碼或包含PHP中的某些內容。

請注意，我真正想要的是以綠色或紅色顯示消息。如果用戶名可用，則用紅色表示其他綠色。

來源

2009-10-23 RKh

你有沒有考慮過使用像JQuery這樣的JavaScript庫？我發現使用庫（文件大小）的成本是由易用性和處理跨瀏覽器問題支付的。 – Vamos 2009-10-23 09:12:20

如何讓ajax.php返回一些預格式化的HTML並使用statechange_username函數來處理響應，將其保存在佔位符div/span中？

順便說一句，你爲什麼設置會話變量？

來源

2009-10-23 09:13:17

會話變量在 – RKh 2009-10-23 09:15:29

以上的PHP代碼中使用我同意@No Surprises，嘗試返回HTML而不是XML，除非您計劃使用類似JQuery的庫 – 2009-10-23 09:23:21

我猜你缺少statechange_username功能，像

function statechange_username() 
{ 
    if (http.readyState==4) 
    { 
     document.getElementById(\"username_eixsts\").innerHTML=http.responseText; 
    } 
}

來源

2009-10-23 09:16:39

我不認爲任何東西都丟失，因爲該網站工作正常除了我想要的顏色。 – RKh 2009-10-23 09:41:21

我會做到這一點使用jQuery和有PHP頁面返回碼（0爲假，1爲真）或類似的。然後，您可以使用jQuery的addClass（）方法，具體取決於返回的結果，全部在javascript中。

來源

2009-10-23 09:38:11

@Matt：你能說明一下嗎？ – RKh 2009-10-23 09:42:45

查找jQuery Ajax文檔，並簡單地使用它來運行POST/GET調用到您的PHP腳本。如果用戶名存在，則回顯1，否則回顯0.然後在ajax調用的'成功'參數中，可以解釋響應，例如： 'if（response == 1）{0}用戶名'）。addClass（ '無效'）; // username exists } else { $（'＃username'）。addClass（'valid'）; //用戶名是唯一的 }' – 2009-10-23 10:19:24

我嘗試了一百萬個組合，無法在註釋中獲取代碼格式以便工作，對不起。 – 2009-10-23 10:20:25

[PHP/AJAX]：根據輸入的文字改變信息的顏色

回答

相關問題