Javascript 为什么数组中的项未定义?

Javascript 为什么数组中的项未定义?,javascript,php,Javascript,Php,所以我想用AJAX将我的JS数组传递给我的PHP代码,我面临一个问题。 我的问题如下:当我将数组发送到php时,它会给我以下错误: 注意:未定义索引:添加食品 第2行C:\xampp\htdocs\etterem\order-food.php 我的代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Rendelés felvétele&l

所以我想用AJAX将我的JS数组传递给我的PHP代码,我面临一个问题。 我的问题如下:当我将数组发送到php时,它会给我以下错误:

注意:未定义索引:添加食品 第2行C:\xampp\htdocs\etterem\order-food.php

我的代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Rendelés felvétele</title>
<style type="text/css">
    body{
        font-family: Arail, sans-serif;
    }
    .search-box{
        width: 300px;
        position: relative;
        display: inline-block;
        font-size: 14px;
    }
    .search-box input[type="text"]{
        height: 32px;
        padding: 5px 10px;
        border: 1px solid #CCCCCC;
        font-size: 14px;
    }
    .result{
        position: absolute;        
        z-index: 999;
        top: 100%;
        left: 0;
    }
    .search-box input[type="text"], .result{
        width: 100%;
        box-sizing: border-box;
    }
    .result p{
        margin: 0;
        padding: 7px 10px;
        border: 1px solid #CCCCCC;
        border-top: none;
        cursor: pointer;
    }
    .result p:hover{
        background: #f2f2f2;
    }
    .list {
        padding-top: 20px;
    }
    .result {
        background-color: white;
    }
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script type="text/javascript">
// var fields = 1;
// function add_fields() {
//     fields++;
//     var objTo = document.querySelector('.search-box')
//     var divtest = document.createElement("div");
//     divtest.innerHTML = '<input type="text" autocomplete="off" placeholder="Étel keresése"/><div class="result"></div>';

//     objTo.appendChild(divtest)
// }

var foods_added = [];
function add_food() {
    var food_name = document.getElementById('food_name').value;
    var entry = document.createElement('li');
    entry.appendChild(document.createTextNode(food_name));
    list.appendChild(entry);
    foods_added.push(food_name);
    document.getElementById('food_name').value = "";
}

function submit_list() {
    $.ajax({
        url: "order-food.php",
        method: "post",
        data: { foods_added : JSON.stringify(foods_added) },
        success: function(res) {
            console.log(res);
        }
    })
    window.location.href = "order-food.php";
}
$(document).ready(function(){
    $('.search-box input[type="text"]').on("keyup input", function(){
        var inputVal = $(this).val();
        var resultDropdown = $(this).siblings(".result");
        if(inputVal.length){
            $.get("backend-search.php", {term: inputVal}).done(function(data){
                resultDropdown.html(data);
            });
        } else{
            resultDropdown.empty();
        }
    });

    $(document).on("click", ".result p", function(){
        $(this).parents(".search-box").find('input[type="text"]').val($(this).text());
        $(this).parent(".result").empty();
    });
});
</script>
</head>
<body>
        <!-- <input type="button" onclick="add_fields();" value="Hozzáad"> -->
        <div class="search-box">
            <input id="food_name" type="text" autocomplete="off" placeholder="Étel keresése" />
            <div class="result"></div>
            <input style="width: 130px;" type="button" onclick="add_food();" value="Hozzáad">
            <input style="width: 130px;" type="button" onclick="submit_list();" value="Rendelés felvétele">
        </div>
        <div class="list">
            <ol id="list" name="food"></ol>
        </div>
</body>
</html>

<?php
   $added_foods = json_decode($_POST['foods_added']);
?>

第二个代码是order-food.php,我将使用它来处理数组,最后它会将数组中的项目提交到数据库中

您启动ajax请求,然后通过调用

window.location.href = "order-food.php";
因此ajax请求被暂停,页面被重新加载,没有post值。只需删除该行,即可完成请求

然后使用类型参数设置方法,而不是使用方法。因此,将ajax请求中的行从

method:"POST"


在尝试解码之前,请确保$\u POST不是空的。如果这些文件都在同一个文件中,那么当您第一次加载itwindow.location.href=order-food.php时,不会填充这些文件;可能是你的问题。当你禁用它时会发生什么呢?数据:JSON.stringify{foods\u added:foods\u added}@imvain2它仍然会给我提示:未定义的索引:foods\u添加在C:\xampp\htdocs\etterem\order-food.php在线2@AlexKudryashev在控制台中,它给了我同样的提示
type:"POST"