2

送信ボタンをクリックすると、ajaxは機能し、phpページは（更新なし）と呼ばれますが、Enterキーを押すと、ページとスクリプトが更新されず?txtname=(INPUTED TEXT)、ページのURLの最後にのみが表示されます。

ajaxコード：

var time_variable;
var root2 = location.protocol + '//' + location.host + '/testing.php';

function getXMLObject()  //XML OBJECT
{
   var xmlHttp = false;
   try {
     xmlHttp = new ActiveXObject("Msxml2.XMLHTTP")  // For Old Microsoft Browsers
   }
   catch (e) {
     try {
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")  // For Microsoft IE 6.0+
     }
     catch (e2) {
       xmlHttp = false   // No Browser accepts the XMLHTTP Object then false
     }
   }var root = location.protocol + '//' + location.host;
   if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
     xmlHttp = new XMLHttpRequest();        //For Mozilla, Opera Browsers
   }
   return xmlHttp;  // Mandatory Statement returning the ajax object created
}

var xmlhttp = new getXMLObject();   //xmlhttp holds the ajax object

function ajaxFunction() {
  var getdate = new Date();  //Used to prevent caching during ajax call
  if(xmlhttp) {
    var txtname = document.getElementById("txtname");
    xmlhttp.open("POST",root2,true); //calling testing.php using POST method
    xmlhttp.onreadystatechange  = handleServerResponse;
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xmlhttp.send("txtname=" + txtname.value); //Posting txtname to PHP File
  }
}

function handleServerResponse() {
   if (xmlhttp.readyState == 4) {
     if(xmlhttp.status == 200) {
       document.getElementById("message").innerHTML=xmlhttp.responseText; //Update the HTML Form element
     }
     else {
        alert("Error during AJAX call. Please try again");
     }
   }
}

html部分：

<body>
<form name="myForm">
<table>
 <tr>
  <td>Enter Name</td>
  <td><input type="text" name="txtname" id="txtname" value="<?php echo $f ?>" /></td>
 </tr>
 <tr>
  <td colspan="2"><input type="button" value="Submit" onclick="ajaxFunction();" /></td>
 </tr>
</table>
</form>
<div id="message" name="message"></div>
</body>
4

3 に答える 3

3

onsumbitフォームに属性を追加する必要があります。

<form name="myForm" onsubmit="ajaxFunction(); return false;">

return false;ページが更新されないようにすることです（つまり、ajaxの代わりに実際に送信します）。

于 2012-05-24T12:21:41.810 に答える
2

ボタンのクリックではなく、フォームの送信にハンドラーを適用する

<form name="myForm" onsubmit="ajaxFunction();">

このようにして、入力またはボタンクリックでフォームが送信された場合でも、関数は機能します。

于 2012-05-24T12:22:57.147 に答える
1

交換

<form name="myForm">

と

<form name="myForm" onsubmit="ajaxFunction();return false;">

ENTERキーを押したときに何をするかを定義しない限り、フォームはENTERでページ自体のGETメソッドで送信されるためです。

于 2012-05-24T12:23:42.700 に答える