1

コードが機能しない理由を誰かが理解するのを手伝ってもらえますか?

div内のテキストをメンバーが書き込んだテキストに変更することはありません。

そして、事前に私の英語を申し訳ありませんが、私の英語の先生はどうやら良い仕事をしていませんでした... = /

最初のページ:

<script>
function showUser()
{
var str = document.forms["myForm"]["users"].value;
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  } 
if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","act2.php?q="+str,true);
xmlhttp.send();
}
</script>

<form name="myForm" onsubmit="return showUser()" method="post">
First name: <input type="text" name="users">
<input type="submit" value="Submit">
</form>

<div id="txtHint"><b>Person info will be listed here.</b></div>

2ページ目(act2.php):(名前を修正)

<?php
$q=$_GET["q"];

echo "$q";
?>
4

4 に答える 4

1

この行で指定されたファイル

xmlhttp.open("GET","act2.php?q="+str,true);

act2.phpですが、あなたの投稿によると、あなたはajax2.phpを探しています、それはそれでしょうか?

于 2013-01-15T10:34:47.390 に答える
1

showUserメソッドで「falseを返す」のを忘れただけです。Ajax呼び出しが行われる前に、フォームは通常どおり投稿されます。

編集: 明確にするために、onsubmitでshowUser()を返すと、showUserメソッドが値を返すことはなく、ブラウザーがフォームを投稿するのを停止します。また、他の投稿者が示唆しているように、phpファイルの名前はajax2.phpであることを意味しますが、コードは実際にはact2.phpをヒットしようとします。

また、ある種のフレームワーク(jQueryが非常に人気があります)を使用することをお勧めします。

于 2013-01-15T10:37:55.810 に答える
0

フォームのデフォルトのアクションを防ぐために、関数はfalseを返す必要があります。そうしないと、フォームが送信されます(これデフォルトのアクションです)。

return falseコードの最後にを追加するだけです。

function showUser(){

   // ...
   xmlhttp.send();

   // prevents the default action (the submit from your form)
   return false;

}

また:

<form name="myForm" onsubmit="showUser();return false;" method="post">

また、IE5/6互換コードを安全に削除できます。

if (window.XMLHttpRequest)
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

単純に次のようになります。

  var xmlhttp=new XMLHttpRequest();

var前は非常に重要です。そうでない場合はxmlhttp、スコープ変数ではなくグローバルオブジェクトのメンバーになります。

于 2013-01-15T11:00:57.800 に答える
0

より少ない苦痛とjQueryで同じことを行う方法を示すためだけに。

<form name="myForm" action="/act2.php">
    <input type="text" name="q">
    <input type="submit">
</form>

<div id="txtHint"></div>

<script type="text/javascript">
    $(document)
        // Link handler for submiting form
        .on('submit', 'form[name="myForm"]', function(e) {
            // Preventing original form submition
            e.preventDefault();

            // Send all data from form, to url from form's action attribute (/act2.php) and set received data to div with id txtHint
            $.get($(this).attr('action'), $(this).serialize(), function(data, status, xhr) {
                $('#txtHint').html(data);
            });
        });
</script>
于 2013-01-15T11:34:54.997 に答える