Question

我的代码旨在通过AJAX使用Google Books API获取输入图书的作者。如果没有输入任何内容，则打印＆＃34;清空＆＃34;。它实际上做的是在输入书籍时打印出Javascript代码。当没有输入任何内容时，它会打印＆＃34;清空＆＃34;正如它应该。如何修改我的代码以使回显的Javascript执行，从而获得输入书籍的作者？

只是看，我用echo "<script>document.getElementById('txtBox').innerHTML = 'Hello';</script>";替换了回声部分。它还打印出javascript代码，因此我认为它与使用API无关。

getAuthor.html

＆＃13;

<!DOCTYPE html>
<html>  
  <body>
	<!-- Input -->
    <div class="form">
      <form onsubmit="makeRequest(); return false">
        <input type="text" id="inputText" name="inputText">
        <input type="submit">
      </form>
    </div>
	
    <br>
    
    <!-- Output -->
    <div class="txtBox">
      <textarea  id="txtBox">
      </textarea>
    </div>
    
    <!-- AJAX to create output using jEcho.php file-->
    <script>
        function makeRequest() {
            httpRequest = new XMLHttpRequest();
            console.log(httpRequest.responseText);
            httpRequest.onreadystatechange = function() {               
                document.getElementById("txtBox").innerHTML = httpRequest.responseText;
            };
            httpRequest.open("POST", "jEcho.php", true);
            httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            httpRequest.send("inputText=" + document.getElementById("inputText").value);
        }

    </script>
  </body>
</html>

＆＃13;

jEcho.php

＆＃13;

<?php
$input = $_POST["inputText"];

if ($input == "") {
    echo "Empty";
} else {
    // used to parse
    // e.g. The Rosie Project -> The+Rosie+Project
    $temp = str_replace(" ", "+", $input);    
    
    // create appropiate source
    $scriptSource = "https://www.googleapis.com/books/v1/volumes?q=$temp&callback=handleResponse";
    
    echo "<script>
           function handleResponse(response) {
              var item = response.items[0];
              document.getElementById('txtBox').innerHTML = item.volumeInfo.authors[0];
            }
          </script>
          <script src='$scriptSource'></script>";
}
?>

＆＃13;

链接

从PHP回应Javascript：

How to call a JavaScript function from PHP?

Echoing javascript from PHP

Google Books API：

https://developers.google.com/books/docs/v1/getting_started

https://developers.google.com/books/docs/v1/using

Answer 1

<script>元素仅在首次加载页面时运行。稍后创建的脚本元素，通过分配给元素.innerHTML，使用document.createElement()创建它们，或其他方式，不会被执行。

如果您想让PHP脚本发回要评估的代码，您必须直接执行此操作，例如：

httpRequest.onreadystatechange = function() {               
    eval(httpRequest.responseText);
};

（并从回复中删除<script>标记。）

Answer 2

尝试在jEcho.php文件中设置标头（未测试）

header('Content-Type: application/javascript');

Answer 3

我不允许发表评论：

我不确定导致它的原因，但可以在<script src='$scriptSource'></script>";功能之前调用handleResponse。我现在不太确定是什么导致它，这是我最好的主意。

你也可以不只是在代码中已经有这样的url：（jEcho.php）

<?php
$input = $_POST["inputText"];

if ($input == "") {
    echo "Empty";
} else {
    // used to parse
    // e.g. The Rosie Project -> The+Rosie+Project
    $temp = str_replace(" ", "+", $input);    

    // create appropiate source
    //$scriptSource = "https://www.googleapis.com/books/v1/volumes?q=$temp&callback=handleResponse";

    echo "
          <script src='https://www.googleapis.com/books/v1/volumes?q=$temp&callback=handleResponse'></script>
          <script>
              function handleResponse(response) {
                 var item = response.items[0];
                 document.getElementById('txtBox').innerHTML = item.volumeInfo.authors[0];
              }
          </script>";
}
?>

通过AJAX未运行从PHP回应Javascript代码

3 个答案: