возникли незначительные проблемы с этим javascript + ajax - PullRequest
0 голосов
/ 30 марта 2012

я пытаюсь перевести информацию, когда я использую следующий код, он работает успешно, так как я дал информацию textarea в предыдущем

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2" />
<title>Example Ajax POST</title>
<script type="text/javascript"><!--
// create the XMLHttpRequest object, according browser
function get_XmlHttp() {
  // create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
  var xmlHttp = null;

  if(window.XMLHttpRequest) {       // for Forefox, IE7+, Opera, Safari, ...
    xmlHttp = new XMLHttpRequest();
  }
  else if(window.ActiveXObject) {   // for Internet Explorer 5 or 6
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

  return xmlHttp;
}

// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID, tolang) {

if(tolang=="-")return;
  var request =  get_XmlHttp();     // call the function for the XMLHttpRequest instance

  // create pairs index=value with data that must be sent to server
  var  the_data = 'data='+document.getElementById('txt2').innerHTML+'&to='+tolang;

  request.open("POST", php_file, true);         // set the request

  // adds  a header to tell the PHP script to recognize the data as is sent via POST
  request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  request.send(the_data);       // calls the send() method with datas as parameter

  // Check request status
  // If the response is received completely, will be transferred to the HTML tag with tagID
  request.onreadystatechange = function() {
if (request.readyState == 4) {
      document.getElementById(tagID).innerHTML = request.responseText;
    }

  }
}
--></script>


</head>
<body>

<textarea id="txt2" rows="20" cols="50">hi wassup</textarea><br/>
<select name="langlist" onchange="ajaxrequest('translator.php', 'txt2', this.options[this.selectedIndex].value)">
  <option value="-" selected>-</option>
<option value="ar">Arabic</option><option value="bg">
Bulgarian</option><option value="ca">
Catalan</option><option value="zh-CHS">
Chinese Simplified</option><option value="zh-CHT">
Chinese Traditional</option><option value="cs">
Czech</option><option value="da">
Danish</option><option value="nl">
Dutch</option><option value="en">
English</option><option value="et">
Estonian</option><option value="fi">
Finnish</option><option value="fr">
French</option><option value="de">
German</option><option value="el">
Greek</option><option value="ht">
Haitian Creole</option><option value="he">
Hebrew</option><option value="hi">
Hindi</option><option value="mww">
Hmong Daw</option><option value="hu">
Hungarian</option><option value="id">
Indonesian</option><option value="it">
Italian</option><option value="ja">
Japanese</option><option value="ko">
Korean</option><option value="lv">
Latvian</option><option value="lt">
Lithuanian</option><option value="no">
Norwegian</option><option value="pl">
Polish</option><option value="pt">
Portuguese</option><option value="ro">
Romanian</option><option value="ru">
Russian</option><option value="sk">
Slovak</option><option value="sl">
Slovenian</option><option value="es">
Spanish</option><option value="sv">
Swedish</option><option value="th">
Thai</option><option value="tr">
Turkish</option><option value="uk">
Ukrainian</option><option value="vi">
Vietnamese</option>
</select><img src="http://www.allsaints-sec.glasgow.sch.uk/Images/QuestionMarkIcon16.gif" title="plz save your copy of data, as there will be chances of data loss during translation"/>

</body>
</html>

если вы удалите текст в textarea до начальной загрузки страницы, то перевод не будет работать, как показано в приведенном ниже коде.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2" />
<title>Example Ajax POST</title>
<script type="text/javascript"><!--
// create the XMLHttpRequest object, according browser
function get_XmlHttp() {
  // create the variable that will contain the instance of the XMLHttpRequest object (initially with null value)
  var xmlHttp = null;

  if(window.XMLHttpRequest) {       // for Forefox, IE7+, Opera, Safari, ...
    xmlHttp = new XMLHttpRequest();
  }
  else if(window.ActiveXObject) {   // for Internet Explorer 5 or 6
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

  return xmlHttp;
}

// sends data to a php file, via POST, and displays the received answer
function ajaxrequest(php_file, tagID, tolang) {

if(tolang=="-")return;
  var request =  get_XmlHttp();     // call the function for the XMLHttpRequest instance

  // create pairs index=value with data that must be sent to server
  var  the_data = 'data='+document.getElementById('txt2').innerHTML+'&to='+tolang;

  request.open("POST", php_file, true);         // set the request

  // adds  a header to tell the PHP script to recognize the data as is sent via POST
  request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  request.send(the_data);       // calls the send() method with datas as parameter

  // Check request status
  // If the response is received completely, will be transferred to the HTML tag with tagID
  request.onreadystatechange = function() {
if (request.readyState == 4) {
      document.getElementById(tagID).innerHTML = request.responseText;
    }

  }
}
--></script>


</head>
<body>

<textarea id="txt2" rows="20" cols="50"></textarea><br/>
<select name="langlist" onchange="ajaxrequest('translator.php', 'txt2', this.options[this.selectedIndex].value)">
  <option value="-" selected>-</option>
<option value="ar">Arabic</option><option value="bg">
Bulgarian</option><option value="ca">
Catalan</option><option value="zh-CHS">
Chinese Simplified</option><option value="zh-CHT">
Chinese Traditional</option><option value="cs">
Czech</option><option value="da">
Danish</option><option value="nl">
Dutch</option><option value="en">
English</option><option value="et">
Estonian</option><option value="fi">
Finnish</option><option value="fr">
French</option><option value="de">
German</option><option value="el">
Greek</option><option value="ht">
Haitian Creole</option><option value="he">
Hebrew</option><option value="hi">
Hindi</option><option value="mww">
Hmong Daw</option><option value="hu">
Hungarian</option><option value="id">
Indonesian</option><option value="it">
Italian</option><option value="ja">
Japanese</option><option value="ko">
Korean</option><option value="lv">
Latvian</option><option value="lt">
Lithuanian</option><option value="no">
Norwegian</option><option value="pl">
Polish</option><option value="pt">
Portuguese</option><option value="ro">
Romanian</option><option value="ru">
Russian</option><option value="sk">
Slovak</option><option value="sl">
Slovenian</option><option value="es">
Spanish</option><option value="sv">
Swedish</option><option value="th">
Thai</option><option value="tr">
Turkish</option><option value="uk">
Ukrainian</option><option value="vi">
Vietnamese</option>
</select><img src="http://www.allsaints-sec.glasgow.sch.uk/Images/QuestionMarkIcon16.gif" title="plz save your copy of data, as there will be chances of data loss during translation"/>

</body>
</html>

Я не вижу здесь смысла, может кто-нибудь сказать мне, почему эта проблема.

Ответы [ 2 ]

0 голосов
/ 30 марта 2012

Я действительно не знаю, почему это не работает.Фактически, ваш код, изменяющий innerHTML в первом примере, просто работает в первый раз на chrome, а в старом IE оба работают всегда.

И я не думаю, что innerHTML относится к стандарту W3C,если вы измените на value, оба будут работать всегда.Например:

var  the_data = 'data='+document.getElementById('txt2').value+'&to='+tolang;

и

document.getElementById(tagID).value = request.responseText;

РЕДАКТИРОВАТЬ: написание кода, соответствующего стандартам, всегда хорошо =)

0 голосов
/ 30 марта 2012

Это, вероятно, не работает, потому что document.getElementById('txt2').innerHTML является нулевым, когда вы удаляете текст из текстовой области.Проверьте эту функцию в firefox и firebug на возможные ошибки / предупреждения.Вы также можете предоставить больше информации о вашей проблеме - что именно происходит .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...