简体   繁体   English

通过AJAX从PHP中回显的Javascript代码未运行

[英]Echoed Javascript Code from PHP Via AJAX Not Running

My code is meant to get the author of an inputted book using the Google Books API via AJAX. 我的代码旨在通过AJAX使用Google图书API吸引输入书籍的作者。 If nothing is inputted it prints "Empty". 如果未输入任何内容,则显示“ Empty”。 What it actually does is print out the Javascript code when a book is inputted. 它的实际作用是在输入书后打印出Javascript代码。 When nothing is inputted, it prints "Empty" as it should. 当没有输入任何内容时,它将按原样打印“空”。 How could I modify my code to make the echoed Javascript execute and hence get the author of an inputted book? 如何修改我的代码以使所执行的Javascript执行并因此获得输入书的作者?

Just to see, I replaced the echo part with echo "<script>document.getElementById('txtBox').innerHTML = 'Hello';</script>"; 只是看到,我用echo "<script>document.getElementById('txtBox').innerHTML = 'Hello';</script>";替换了echo部分echo "<script>document.getElementById('txtBox').innerHTML = 'Hello';</script>"; . It also prints out the javascript code, so I don't think it has something to do with using the API. 它还会打印出javascript代码,因此我认为它与使用API​​无关。

getAuthor.html getAuthor.html

 <!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> 

jEcho.php jEcho.php

 <?php $input = $_POST["inputText"]; if ($input == "") { echo "Empty"; } else { // used to parse // eg 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>"; } ?> 

Links 链接

Echoing Javascript From PHP: 从PHP中回显Javascript:

How to call a JavaScript function from PHP? 如何从PHP调用JavaScript函数?

Echoing javascript from PHP 从PHP回显JavaScript

Google Books API: Google Books API:

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

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

<script> elements are only run when your page is first loaded. <script>元素仅在首次加载页面时运行。 Script elements created later on, either by assigning to an element's .innerHTML , creating them using document.createElement() , or otherwise, are not executed. 稍后创建的脚本元素(通过分配给元素的.innerHTML ,使用document.createElement()创建它们document.createElement()或以其他方式不执行。

If you want to have a PHP script send back code to be evaluated, you'll have to do that directly, eg: 如果要让PHP脚本发送回代码进行评估,则必须直接执行,例如:

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

(And remove the <script> tags from the response.) (并从响应中删除<script>标记。)

尝试在jEcho.php文件中设置标题(未测试)

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

I'm not allowed to comment so: 我不允许发表评论:

I'm not certain what has caused it for but could <script src='$scriptSource'></script>"; be called before the handleResponse function. I'm not too sure what is causing it, at the moment, that is my best idea. 我不确定是什么原因造成的,但是<script src='$scriptSource'></script>";可以在handleResponse函数之前调用。我不太确定是什么原因导致的是我最好的主意。

Also could you not just have the url already in the code like this: (jEcho.php) 您还不仅可以在这样的代码中已经包含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>";
}
?>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM