Ajax + PHP驗證並在PHP驗證內調用Javascript函數

Question

基本上，我試圖在使用Ajax時在PHP腳本中調用Javascript函數。

JavaScript：

<script type="text/javascript">
    function Validate() {
        hr = new XMLHttpRequest();
        name = document.getElementById('name').value;

        hr.open('POST', 'validator.php', true);
        hr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

        hr.onreadystatechange = function() {
            if ( hr.readyState == 4 && hr.status == 200 ) {
                document.getElementById('message').innerHTML = hr.responseText;
            }
        }
        hr.send('name=' + name);
    }

    function disable() {
        document.getElementById('message').innerHTML = '';
    }
</script>

HTML：

<div id="message"></div>
Name: <input type="text" id="name /">
<input type="button" onclick="Validate();" value="Validate" />

PHP：

<?php    
   $name = $_POST['name'];    
   if ( !empty( $name ) ) {
       if ( $name == 'Tom' ) {
           echo "<script>alert('Hello Tom, Welcome Back')</script>";
       } else {
           echo 'You are not Tom';
       }
   } else {
       echo 'Please enter a name.';
   }
?>

除了在PHP echo <script>alert()</script>內調用Javascript函數echo <script>alert()</script>之外，一切工作正常

我認為這里的問題是因為我聲明了hr.responseText ，因此，我想顯示的javascript已返回文本。 但是我應該怎么做才能解決這個問題？

任何幫助，將不勝感激。

Answer 1

嘗試這個：

   function do_alert($msg){
            echo '<script type="text/javascript">alert("' . $msg . '"); </script>';
   }
   if(!empty($name)){
         if($name == 'Tom'){
             do_alert("You are tom");
          }else{
             do_alert("You are not tom");
          }
  }else{
         echo 'Please enter a name.';
   }        

Answer 2

你沒有標簽jQuery ，但如果你使用它， $.getScript可能是你想要的。

除此之外，最好將腳本構建到原始文檔中，然后根據響應文本執行此功能。

Answer 3

嘗試從"<script>alert('Hello Tom, Welcome Back')</script>";更改回顯"<script>alert('Hello Tom, Welcome Back')</script>";

只是'Hello Tom, Welcome Back';

然后在您的JavaScript中，您可以調用alert(hr.responseText);

您將必須更改Javascript以檢查返回的內容，以便知道調用alert或document.getElementById('message').innerHTML = hr.responseText;

編輯：我將添加所有更改的代碼...

<?php

$name = $_POST['name'];

if(!empty($name)){
  if($name == 'Tom'){
   echo 'Hello Tom, Welcome Back';
}else{
    echo 'You are not Tom';
}
}else{
  echo 'Please enter a name.';
}
 ?>

Java腳本

<script type="text/javascript">
function Validate(){
   hr = new XMLHttpRequest();
   name = document.getElementById('name').value;

hr.open('POST', 'validator.php', true);
hr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

hr.onreadystatechange = function(){
  if(hr.readyState == 4 && hr.status == 200){
   response = hr.responseText.replace(/^\s+|\s+$/g,'');  //remove whitespace so you can compare
   if (response == ("You are not Tom") || response == ("Please enter a name."))
     {
     document.getElementById('message').innerHTML = hr.responseText;
     }
     else {  
       alert(hr.responseText);
    }
    }
}
hr.send('name=' + name);
}

function disable(){
   document.getElementById('message').innerHTML = '';
}
</script>