AJAX请求未显示在同一页面上

Question

我想让用户填写一个网站的网址，当点击提交按钮时，我想要一个ajax请求触发并在<div id="test"></div>的同一页上显示响应，但是当我填写输入字段并点击提交时，什么也不显示。但是如果我检查控制台，我会看到ajax页面被请求。

这是pagespeed.html

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>

<form method="post">
    <input type="text" id="website" name="website">
    <button id="button_1" value="val_1" name="but1">button 1</button>
</form>

<script>
$("button").click(function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST",
        url: "/lighthouse.php",
        data: { 
            email: $('#website').val() // < note use of 'this' here
        },
        success: function(result) {
            $('#test').html(data);
        },
        error: function(result) {
            alert('error');
        }
    });
});
</script>

<div id="test">

</div>

这是lighthouse.php

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>

<script>
$(document).ready(function() {
    // INTRODUCTION RIGHT
    $("#test").text("Let's get in touch");
});
</script>

因此jQuery函数不会显示在pagespeed.html页面上，因为<div id="test"></div>保持为空。

耽误您时间，实在对不起!

Answer 1

您需要从

$(‘#.html’)测试(数据)；

至

$(‘#.html’)测试结果；

因为