提前为我的天真道歉，我绝对不是一个网络开发人员。
我试图获取一个简单HTML表单的内容，将其作为GET请求提交给我正在运行的一个非常轻量级的服务器，并在同一页面上呈现结果。到目前为止，这是我的代码：
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<script>
var submit_button = $('#submit_form');
submit_button.click(function() {
var word = $('word').val();
var data = '?word=' + word;
var update_div = $('#update_div');
$.ajax({
type: 'GET',
url: 'http://35.45.55.65:5000/api',
data: data,
success:function(html){
update_div.html(html);
console.log("Done");
console.log(html)
}
});
});
</script>
<h1>Enter a word to check</h1>
<form id="my_form">
Word: <br/> <input name="word" id="word" type="text" /><br />
<input id="submit_form" type="submit" value="Submit">
</form>
<div id="update_div"></div>
从我读到的所有内容来看，这个代码应该工作吗？然而，表单根本没有被提交，相反，GET请求被附加到当前URL，而JS代码甚至没有运行——就像这样：currentURL.com/test.html?word=hello+world
我真的不知道这里发生了什么，任何帮助都将不胜感激！！谢谢：)
您需要防止表单的默认行为。这就是将这些值附加到URL的原因。
submit_button.click(function (event) {
event.preventDefault();
// rest of code
}