Javascript 为什么'；jquery提交工作正常吗？

这段代码在当前状态下运行良好，即时消息在按钮上使用单击事件。但是如果我在html代码中的输入标记周围使用表单标记，并使用jquery的submit方法，则不会给出任何结果。为什么会这样？我必须使用表单元素，因为我希望能够使用enter键而不是单击按钮进行搜索

Html:

标题：

jQuery：

 $(document).ready(function(){

  $("#btn").on("click", function(){
   var textval = $('#title').val();
   var playListURL = 'https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=' + textval + '&format=json&callback=?';
   $.ajax({
    type: "GET",
    url: playListURL,
    contentType: "application/json; charset=utf-8",
    async: false,
    dataType: "json",
    success: function (data, textStatus, jqXHR) {
        for (var i = 0; i < 10; i++)
        {
           var url = "https://en.wikipedia.org/wiki/" + data.query.search[i].title;
           $("#results").append("<b> <a href='" + url + "' > " + data.query.search[i].title + "</a></b></br> ");
         //console.log(url);
        } 
    },
    error: function (errorMessage) {
    }
   });
   //alert($('#title').val());
  });
 });

$（文档）.ready（函数（）{
$（“#btn”）。在（“单击”，函数（）{
var textval=$（'#title'）.val（）；
var playlayurl='1〕https://en.wikipedia.org/w/api.php?action=query&list=search&srsearch=“+textval+”&format=json&callback=？”；
$.ajax({
键入：“获取”，
url:url，
contentType:“应用程序/json；字符集=utf-8”，
async:false，
数据类型：“json”，
成功：函数（数据、文本状态、jqXHR）{
对于（变量i=0；i<10；i++）
{
变量url=”https://en.wikipedia.org/wiki/“+data.query.search[i].title；
$（“#结果”）。追加（
”；
//console.log（url）；
} 
},
错误：函数（错误消息）{
}
});
//警报（$（'#title'）.val（））；
});
});

尝试更改此行

$("#btn").on("click", function(){

为此：

$("#btn").on("click", function(e){
   e.preventDefault();

---

然后表单将不会以默认方式单击提交。请提供在当前显示的代码旁边放置“在我的html代码中的输入标记周围放置表单标记并使用jquery的提交方法”时使用的代码。谢谢，你是说这样的吗

$("#btn").on("click", function(e){
   e.preventDefault();