Javascript 返回多个值ajax和php

这是我第一次使用AJAX，我正在创建一个鼓循环生成器，而不是刷新页面来创建一个新的循环，我想尝试AJAX

当点击#button1时，它运行generate.php，我试图从generate.php echo返回多个值，并将它们放在页面的不同元素中

不同的值是要放置在音频src中的文件url、背景图像url、循环的条数以及循环的BPM。它们在php echo中用逗号分隔

当我点击按钮时，google开发者工具中出现了一个错误，上面写着“jquery-1.7.1.min.js:4 get 404（未找到）”

按钮：

<div id="button1"><div class="namething">Generate</div></div>

$returnArr = [$fileurl,$imageurl,$bars,$randbpm];    
echo json_encode($returnArr);

我不确定，但我认为这与jQuery中的“数据”有关，我只需要找出如何返回回显数据

当我单击按钮时，它正在工作并创建一个新循环，只是没有正确返回echo数据，所以我知道generate.php的路径是正确的

编辑：（解决方案）

谢谢@Thamilan的帮助！为了更新音频播放器，我不得不对jquery做了一些小改动，现在一切都正常工作了：

Jquery

<script>
$('#button1').click(function(){
    $.ajax({
        type:'post',
        url:'generate.php',
        data: $(this).val(),                 
        success: function(value){
             var data = value.split(",");
            $('#fileurl').val(data[0]);
            $('body').css('background-image', 'url(' + data[1] + ')');
            $('#bars').val(data[2]);
            $('#bpm').val(data[3]);
        }
    }); 
  });
</script>

<script>
$('#button1').click(function(){
    $.ajax({
    type:'post',
    url:'generate.php',
    data: $(this).val(),
    dataType: 'json',
    success: function(data){
        var fileName = data[0];
        $("#music").attr("src",fileName).trigger("play");
        $('#timeline').css('background-image', 'url(' + data[1] + ')');
        $('#bars').text(data[2]);
        $('#bpm').text(data[3]);
    }
}); 
  });
</script>

---

在

generate.php

中，将它们添加到数组中，并编码为JSON并发送。在AJAX中获取JSON，打印输出

使您的AJAX类似于：

$.ajax({
    type:'post',
    url:'generate.php',
    data: $(this).val(),
    dataType: 'json',          //Added this
    success: function(data){   //value to data
        $('#fileurl').val(data[0]);
        $('body').css('background-image', 'url(' + data[1] + ')');
        $('#bars').val(data[2]);
        $('#bpm').val(data[3]);
    }
}); 

generate.php

$returnArr = [$fileurl,$imageurl,$bars,$randbpm];    
echo json_encode($returnArr);

---

这是一个表单按钮吗？如果只是一个div generate，则需要防止默认提交。很可能您的路径不正确，无法将它们添加到数组中。从generate以JSON的形式发送，在AJAX中获取JSON，然后打印。我刚刚检查了我的数据库，当我单击按钮时，它正在工作并创建一个新的循环，它只是没有正确返回回显数据，所以我知道生成的路径是正确的。phpHey Thamilan，这正在工作，它正在返回数据！谢谢

$returnArr = [$fileurl,$imageurl,$bars,$randbpm];    
echo json_encode($returnArr);