Javascript 如何制作活动网页

我在网页中有一个文本框，我希望当用户在其中键入内容时，显示它而不刷新

从用户处获取数据并显示数据的我的php文件：

<?php 
    $text = $_GET['text'];
    echo $text;
?>

和html文件：

<form method="Get">
    <input type="text" name="text">
</form>

当用户键入输入时，如何使其键入$text。

请使用javascript（AJAX）进行此过程

您所需要做的就是将php文件保存在一个单独的文件中，并使用AJAX连接它

<form method="Get">
<input type="text" name="text" onKeyUp="makeAjaxCall()" id="input">
    </form>



<script>
function makeAjaxCall() {
let input = document.getElementById('input').value;
if(input){
// make the ajax function call here
// Ajax response is injected into the document using innerHTML.
connectViaAJAX();
} else {
// no input is provided.
}
}



function connectViaAJAX() {
// write ajax here
}
</script>

函数makeAjaxCall（）{
让输入=document.getElementById（'input'）。值；
如果（输入）{
//在这里进行ajax函数调用
//Ajax响应使用innerHTML注入到文档中。
connectViaAJAX（）；
}否则{
//没有提供任何输入。
}
}
函数connectViaAJAX（）{
//在这里编写ajax
}

还有其他javascript库，您可以查看 角度：

VueJs：

ReactJs：

还有更多

---

您可以访问：了解更多编程教程

在这种情况下使用PHP和AJAX有什么意义？如果您不在数据库中存储任何来自用户类型的数据，我就看不到无序排列

您可以使用简单的JavaScript函数读取输入值，并将其设置为任何元素的innerHTML

看看这个JavaScript：

document.querySelector('input[name="text"]').addEventListener('keyup', function(e){
  const input = e.target;
  document.querySelector('#result').innerHTML = input.value;
})

这个HTML结构：

<form method="Get">
    <input type="text" name="text">
</form>
<div id="result"></div>

在您键入输入时，它会自动用值补充[id=“result”]

这是正在运行的演示：

---

你好，梅子

听起来您需要查找AJAX。您的表单没有操作，请尝试AJAX