※ ChatGPTを利用し、要約された質問です(原文:javascriptの質問です。)
javascriptでの会員登録フォーム作成時の名前の重複チェック方法について
javascriptの質問です。
会員登録のためのフォームを作成しています。
会員名が既に使用されている名前か否かを、リアルタイムで表示させたいと思っています。
以下のような形にしたところ、キーボードを高速で連打された時に
ぎこちない動きになってしまいます:;
改善策のご指南、お願い致しますm_m
<htmlソース>
onfocus="checkUserName()"
onkeyup="checkUserName()"
<javascript>
function $(e){
if(typeof e=='string'){
e=document.getElementById(e);
return e;
}
}
function hide(elementID){
$(elementID).style.display = "none";
}
function show(elementID){
$(elementID).style.display = "block";
}
// DB接続をするPHPファイルへ情報を送信する関数
function checkUserName(){
// いったん入力をできなくする(キーボード高速連打によるエラー回避その1)
$(nameInputTextID).readOnly = false;
// 「認識中です」を表示
show("searching");
// PHPファイル呼出⇒PHPからの受信用の関数を走らせる
toBeChecked = $(nameInputTextID).value;
ajax.post("check_used_name.php", getReplyFromPHP, "to_be_checked="+toBeChecked);
}
// PHPファイルから情報を受信して判定を表示する関数
function getReplyFromPHP(replyFromPHP) {
// PHPファイルからの返答に入っている改行を削除
replyFromPHP = replyFromPHP.replace(/\r\n/g, "");
replyFromPHP = replyFromPHP.replace(/\n/g, "");
// PHPファイルからは、「チェックをした文字列」「使用可否」がカンマ区切りの状態で
// 返答が返ってきているので、ふたつをばらして配列にセット
var arrayReply = replyFromPHP.split(",");
// PHPファイルでチェックをした文字列を入力テキストボックスに入れる
// (キーボード高速連打によるエラー回避その2)
$('nameInputTextID').value = arrayReply[0];
//「使える名前です」「既に使われてます」表示
if(arrayReply[1]== ・・・省略){}
// 入力できる状態に戻す(キーボード高速連打によるエラー回避その1)
$('toBeCheckedString').readOnly = false;
}