-3

こんにちは、私はこのコードを持っています、そして私はそれを動かすことができません。私はAjaxjQueryとJavaScriptを初めて使用するので、よろしくお願いします:)そして助けてくれてありがとう:)このコードは単純なフォーム検証であるはずですが、次の入力ボックスにタブで移動しても何も起こりません。unameの長さが5文字未満であるというエラーメッセージが表示されているはずです。ありがとうございました！

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function validateUsername(){
    var uname=document.getElementById("uname").value;
    if(uname<5){
        document.getElementById("errormsg").value = "wait";
    }

}
</script>

<body>
<form method=post id=regform action=jscript.html>
<table>
    <tr>    
        <td>Username</td>
        <td><input type=text name=uname id=uname onBlur="javascript:validateUsername()"/></td>
        <td><input type=hidden name=errormsg value='' id=errormsg"/></td>
    </tr>
    <tr>    
        <td>Password</td>
        <td><input type=text name=uname id=uname onBlur="javascript:validatePassword()"/></td>
        <td><input type=hidden name=errormsg value='' id=errormsg"/></td>
    </tr>
</table>
</form>

4

4 に答える 4

2

これを試してみてください、私はそれが役立つことを願っています。HTMLを改善し、 type = "text" name = "uname"のようなすべての属性の値を引用符で囲む必要があります。作成したのは、jqueryではなくjavascriptだけなので、その.jsファイルも含める必要はありません。関数validateUsernameで、unameはユーザーが入力した文字数を保持し、5未満の場合、errormsg（divのID）はwaitmsgを表示します。

ユーザーにエラーメッセージを表示するためにinputtype= "hidden"は必要ありません。そのために、DIVまたはSPANを使用してください。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function validateUsername(){
    var uname=document.getElementById("uname").value.length;
if(uname<5){
    document.getElementById("errormsg").innerHTML = "wait";
}

}
</script>
</head>
<body>
<form method="post" id="regform" action="jscript.html">
<table>
<tr>    
    <td>Username</td>
    <td><input type="text" name="uname" id="uname" onBlur="validateUsername()"/></td>
    <td><div id="errormsg"></div></td>
</tr>
<tr>    
    <td>Password</td>
    <td><input type="text" name="pass" id="pass" /></td>
    <td></td>
</tr>
</table>
</form>
</body>
</html>
于 2012-05-05T04:03:21.683 に答える
1

（uname <5）は（uname.length <5）でなければなりません

于 2012-05-05T04:04:40.857 に答える
1

あなたの問題のいくつかは次のとおりです。

 <input type=hidden name=errormsg value='' id=errormsg"/>

値の前後に一組の逆コンマがありませんid。それは読むべきです：

 <input type=hidden name=errormsg value='' id="errormsg"/>

また、HTMLでは、IDはドキュメント全体で一意である必要があります。したがって、IDが「errormsg」の2つの入力フィールドを持つことは許可されていません。それらに異なるものを指定する必要があります。

また、Wezelkrozumが発見したように、ユーザー名の長さを測定する必要があります。

于 2012-05-05T04:10:27.177 に答える
0

jsbinまたはjsfiddleでコードをテストすることでメリットが得られる場合があります。

これは、問題を解決する方法の実例です。

http://jsbin.com/oyejic/7/edit#javascript,html,live

jsbinの例で遊ぶことをお勧めします。以下は、jsbinの例のコードです（ライブラリへの外部リンクは削除されています）。

<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="jquery.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
</style>
</head>
<body>
<form method="post" id="regform" action="jscript.html">
<table>
    <tr>    
        <td>Username</td>
        <td><input type="text" name="uname" id="uname" /></td>
        <td><input type="hidden" name="uname_errormsg" value="" id="uname_errormsg" /></td>
    </tr>
    <tr>    
        <td>Password</td>
        <td><input type="text" name="pword" id="pword" /></td>
        <td><input type="hidden" name="pword_errormsg" value="" id="pword_errormsg" /></td>
    </tr>
</table>
</form>

  <div id="testing"></div>

<script type="text/javascript">
function validateField( inputID ) {
    var fieldName = $('#' + inputID).val();
    if ( fieldName.length < 5 ) {
        $('#' + inputID + '_errormsg').val("wait");
        $("#testing").empty()
                     .text("hey, wait " + inputID + "!" ); 
    } else {
        $("#testing").empty()
                     .text("Ah, 5 or more characters for " + inputID + "!" );     
    }
} 

  $("#uname, #pword").blur(function() {
    validateField( this.id ); 
  });
  </script>
</body>
</html>

いくつかのメモ：

  1. jQueryライブラリの学習を開始することでメリットが得られる場合があります。コードでjQueryを参照していますが、それを使用していません。私が投稿した例では、jQueryを使用しています。

  2. インラインJavaScriptは避けてください。onBlur="javascript:validateUsername()" HTML内などのJavaScriptイベントを配置すると、煩雑になり、メンテナンスの問題が発生する可能性があります。

  3. html属性を閉じます。id=errormsg"する必要がありますid="errormsg"

  4. また、 JavascriptEnlightenmentを読む価値があるかもしれません。

于 2012-05-05T04:29:57.693 に答える