根据PHP输出执行Javascript

时间:2015-02-18 02:51:41

标签: javascript php html ajax json

我正在尝试使我的代码test.php执行一些Javascript代码,如果我的PHP代码conditional.php看到输入的内容然后提交。相反,我的代码所做的是输出"Not empty"而不是"Do Something in Javascript"。我注意到一件奇怪的事情是doSomething()中的{26}号(test.php函数内)被忽略了,但它仍会在文本框中打印出"Empty""Not empty"

我这样做的原因是因为我实际网站中的代码需要使用Javascript API或者只需要PHP来根据输入生成输出。

test.php的

<!DOCTYPE html>
<html>
  <body>
    <!-- Input -->  
    <div class="form">
      <form action="test.php" method="post">
        <input type="text" id="inputText" name="inputText">
        <input type="submit">
      </form>
    </div>

    <br>

    <!-- Output -->
    <div class="txtBox">
      <textarea id="txtBox">
<?php require_once "conditional.php";?>
      </textarea>
    </div>

    <script>
        function makeRequest() {
            httpRequest = new XMLHttpRequest();

            httpRequest.onreadystatechange = doSomething() {
                // get echoed json from conditional.php
                document.getElementById("txtBox").innerHTML = httpRequest.responseText;

               /if (httpRequest.responseText == "Not Empty") {
                    // do my Javascript code
                    document.getElementById("txtBox").innerHTML = "Do something in Javascript";
                }
            };

            httpRequest.open("GET", conditional.php);
            httpRequest.send();
        }
    </script>
  </body>
</html>

conditional.php

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

if ($input != "") {
    echo json_encode("Not empty");
} else {
    echo json_encode("Empty");
}
?>

3 个答案:

答案 0 :(得分:1)

你的代码有一些事情正在阻止你获得你所追求的行为。

首先,您尝试通过GET发送数据,但通过POST访问它。其次,您的表单数据实际上并未通过您的AJAX调用发送。最后,您的函数makeRequest()实际上并未在任何地方调用。您收到了<textarea>中的文字,因为其内部有conditional.php输出。

在您的情况下,您需要删除表单的提交功能(因为您通过AJAX执行),调用您的makeRequest()函数,发送数据,获取响应并编辑{{ 1}}。

要考虑的另一件事是,为什么不使用HTTP响应代码而不是比较文本返回值?它适用于这些情况,您可以使用PHP进行设置。

这是你的两个文件修改了一下,以实现你的目标。

<强> test.php的

<textarea>

<强> conditional.php

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

    <script>
        function makeRequest() {
            httpRequest = new XMLHttpRequest();            
            httpRequest.onreadystatechange = function() {
                if(httpRequest.readyState == 4) {
                    document.getElementById("txtBox").value = httpRequest.responseText;
                    if (httpRequest.status == 200) {
                        // do my Javascript code
                        document.getElementById("txtBox").value = "Do something in Javascript";
                    } else {
                        document.getElementById("txtBox").value = "Empty";
                    }
                }
            };
            httpRequest.open("POST", "conditional.php", true);
            httpRequest.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            httpRequest.send("inputText=" + document.getElementById("inputText").value);
        }
    </script>

  </body>
</html>

请注意,<?php if (isset($_POST["inputText"]) && $_POST["inputText"] != "") { http_response_code(200); } else { http_response_code(400); } ?> 在PHP&gt; = 5.4中可用 - 之前的任何版本,您必须使用http_response_code()函数。

答案 1 :(得分:0)

首先,您根本不会将数据发布到conditional.php。您的表单操作指向test.php

所以改变:

<div class="txtBox">
      <textarea id="txtBox">
<?php require_once "conditional.php";?>
      </textarea>
    </div>

为:

<div class="txtBox">
      <textarea id="txtBox">
<?php if($_SERVER['REQUEST_METHOD'] == 'POST'){
         if($_POST['inputText'] != ''){?>
          <script type="text/javascript">
                alert("this is when something is pressedeven including space");//here goes your javascript function or any html
          </script>
        <?php } 
         else{
          echo "when nothing is inputed. Empty" // this is the php
         }
       } ?>
      </textarea>
</div>

答案 2 :(得分:0)

<强> test.php的

<!DOCTYPE html>
<html>
  <body>
    <!-- Input -->  
    <div class="form">
      <form method="post">
        <input type="text" id="inputText" name="inputText">
        <input type="button" value="Ok" onclick="makeRequest();" >
      </form>
    </div>

    <br>

    <!-- Output -->

<div class="txtBox">
  <textarea id="txtBox">
  </textarea>
</div>

<script>
function makeRequest() {
    if (document.getElementById("inputText").value != "") {
        httpRequest = crearXMLHttpRequest();

        function crearXMLHttpRequest() {
            var xmlHttp = null;
            if (window.ActiveXObject)
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            else
                if (window.XMLHttpRequest)
                    xmlHttp = new XMLHttpRequest();
            return xmlHttp;
        }

        httpRequest.onreadystatechange = function () {
            if (httpRequest.readyState == 4 && httpRequest.status == 200) {
                // get echoed json from conditional.php
                document.getElementById("txtBox").innerHTML = httpRequest.responseText;

                if (httpRequest.responseText == "Not Empty") {
                    // do my Javascript code
                    document.getElementById("txtBox").innerHTML = "Do something in Javascript";
                }
            }
        };

        httpRequest.open("GET", "conditional.php?inputText=" + document.getElementById("inputText").value, true);
        httpRequest.send(null);
    }
    else {
        //Do javascript code
    }
}
</script>
  </body>
</html>

您的 conditional.php 如下所示:

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

if ($input != "") {
    echo "Not empty";
} else {
    echo "Empty";
}
?>