javascript - PHP获取提交按钮的值

标签 javascript php jquery ajax

尝试让 PHP 返回按钮的值。不确定出了什么问题,但它返回了这些错误:

“注意:未定义索引:第 2 行/storage/ssd4/271/3416271/public_html/ajaxTest.php 中的数据 注意:未定义索引:第 5 行/storage/ssd4/271/3416271/public_html/ajaxTest.php 中的数据”

当我 print_r($get) 它返回一个空数组。 HTML 代码看起来不错,所以我想我搞乱了 AJAX?

(提前感谢您提供的任何帮助!)

这是我的 HTML、js 和 PHP 供引用:

<!DOCTYPE html>
<html>

<head>
    <script type="text/javascript" src="ajaxTest.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <title>AJAX test</title>
</head>
<body>

<div id="area">
    <h2>Sending Data to the Server</h2>
    <form action="" method="GET">
        <button type="submit" name="data" value="1" onclick="getData('ajaxTest.php', 'moreText')">1</button>
        <button type="submit" name="data" value="2" onclick="getData('ajaxTest.php', 'moreText')">2</button>
    </form>
    <br />
    <p id="moreText">The fetched message should appear here.</p>
</div>    
</body>    
</html>




var XMLHttpRequestObject = false;

if(window.XMLHttpRequest) {

    XMLHttpRequestObject = new XMLHttpRequest();
}
else if(window.ActiveXObject){
    XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
}

function getData(dataSource, divID) {

    if(XMLHttpRequestObject){
        var obj = document.getElementById(divID);
        XMLHttpRequestObject.open("GET", dataSource);

        XMLHttpRequestObject.onreadystatechange = function() {
        if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200) {
            obj.innerHTML = XMLHttpRequestObject.responseText;
        }
      }

      XMLHttpRequestObject.send();
    }
}




 <?php
 if ($_GET["data"] == "1") {
 echo 'The server got a value of 1';
 }
 if ($_GET["data"] == "2") {
 echo 'The server got a value of 2';
 }
?>

最佳答案

好吧,重写后,这将是正确的方法:

<!DOCTYPE HTML>
<html lang='en'>
    <head>
        <meta charset='UTF-8'>

        <!-- CSS -->
        <link rel="stylesheet" type="text/css" href="style.css" />

        <!-- JS -->
        <script type="text/javascript" src="ajaxTest.js"></script>
        <script type="text/javascript">

        function getData(dataSource, divID, data){

            var xhr = new XMLHttpRequest();
                data = encodeURIComponent(data);
                ele = document.getElementById(divID);

            xhr.open('GET', dataSource + '?data=' + data, true);
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
            xhr.onload = function() {
                if (xhr.status === 200) {
                    alert('PHP Returned: ' + xhr.responseText);
                    ele.innerHTML = xhr.responseText;
                }
                else if (xhr.status !== 200) {
                    alert('Request failed.  Returned status of ' + xhr.status);
                }
            };
            xhr.send(null);
        }
        </script>

        <title>AJAX test</title>
    </head>
    <body>
        <div id='area'>
            <h2>Sending Data to the Server</h2>

            <button type="button" value="1" onclick="getData('ajaxTest.php', 'moreText', this.value)">1</button>
            <button type="button" value="2" onclick="getData('ajaxTest.php', 'moreText', this.value)">2</button>

            <p id="moreText">The fetched message should appear here.</p>
        </div>
    </body>
</html>

我已经删除了表单,因为您所做的只是单击按钮。您根本没有提交表格。这样您也不必阻止默认表单操作。

我还稍微更改了您的 PHP,以便它返回它所得到的内容,而不仅仅是猜测:

<?php

if(!empty($_GET['data'])){
    echo 'The server got a value of: '. $_GET['data'];
}

?>

我自己测试了代码,它当然工作得很好。

关于javascript - PHP获取提交按钮的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46986010/

相关文章:

javascript - 访问器属性及其函数名称

php - 如何使用 get_object_vars 获取属性的层次顺序?

javascript - 星级评分系统jquery

php - 截至 2012 年 11 月,通过 json 和 php 获取 youtube 数据的正确语法是什么?

php - 在Moodle中使用rest api创建测验

jquery - $ ("div#myDiv").css ("content") 在 IE8 中返回未定义

javascript - 如何将文件和属性发送到 ASP.NET MVC 中的 Controller 并接收动态生成的 PDF 作为二进制作为响应?

javascript - 具有现代 ES6 javascript 类的方法的局部临时变量

javascript - 我如何使用本地存储来存储多个变量的值?

javascript - 错误: SecurityError: DOM Exception 18 Tizen