Блог

Я довольно новичок в AJAX, поэтому, пожалуйста, простите меня.

У меня есть формы — первая работает, а вторая нет, и я не знаю почему. В первой html-форме нет кнопки отправки, но во второй есть. Они оба используют одну и ту же функцию javascript.

 <script type="text/javascript">
function showUser(str)
{
if (str=="")
 {
 document.getElementById("txtHint").innerHTML="";
 return;
 } 
if (window.XMLHttpRequest)
 {// code for IE7 , Firefox, Chrome, Opera, Safari
 xmlhttp=new XMLHttpRequest();
 }
else
 {// code for IE6, IE5
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
 }
xmlhttp.onreadystatechange=function()
 {
 if (xmlhttp.readyState==4 amp;amp; xmlhttp.status==200)
   {
   document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
   }
 }
xmlhttp.open("GET","server_script.php?q=" str,true);
xmlhttp.send();
}
</script>
  

Из 1:

 <form>
<select name="users" onchange="showUser(this.value)">
<option value="0001">0001</option>
  

0002

Здесь будет указана информация о персонаже.

Из 2:

 <form onsubmit="showUser(this.foo.value)">
<input type="foo" >
<input type="submit" >
</form>
<br />
<div id="txtHint"><b>Person info will be listed here.</b></div>
  

На первом из них запускается ваш ajax onchange , как таковой, нет поведения по умолчанию, которое могло бы помешать этому.

Во второй форме вы используете onsubmit событие, которое по умолчанию отправляет форму обратно на сервер. Итак, вы должны return false или preventdefault в этом событии разрешить завершение вашего ajax-кода. Самым простым решением было бы просто добавить возвращаемое значение false:

 <form onsubmit="showUser(this.foo.value); return false;">
  

Заставьте showUser возвращать false, в противном случае форма будет отправлена браузером обычным способом.