Javascript 在jQuery的GET请求中使用send按钮

我正在使用jQuery向服务器发送请求，然后呈现结果。但是，现在我想使用一个按钮，这样请求只能在点击发送按钮后发送，而不像我以前的代码那样，我使用了一个无法控制的“onkeyup”；因为我想在输入完我的请求之后而不是之前发送请求

         <script>
       function Search(query_text)
        {
        $.get( "http://localhost:9000?query="+query_text, function( data ) {
                 $(\"#div2\").empty()
                 ..............
                 $(\"#div2\").append("</table>")
        }, "json")
    .fail(function() {
           $("#rep")
               .append('<br/><p style="color:red">Oops! Error with XMLHttpRequest</p>')
        });
        ;
        }   
        </script>

函数搜索（查询文本）
{
$.get（”http://localhost:9000?query=“+查询\文本、函数（数据）{
$（\“\”div2\”）.empty（）
..............
$（\“\”div2\”。追加（“”）
}“json”）
.fail（函数（）{
$（“代表”）
.append（“
Oops！XMLHttpRequest出现错误”
）
});
;
}   

这是调用jQuery函数的输入：

  <input id="queryText" type="text" onkeyup="Search($(this).val())" /><br>

我尝试添加一个简单的按钮，然后像这样调用jQuery函数，但没有成功，因为页面重新加载，我没有得到我需要的结果：

        <form class="form-inline">
        <div class="form-group">
        <input type="text" class="form-control" id="queryText" placeholder="Your text">
        </div>
        <button type="submit" class="btn btn-primary" onclick="Search($('#queryText').val())">Find courses</button>
        </form>

找课程

我不知道是否有一种方法可以继续使用GET请求，而不是使用表单，并在那一次发送POST请求

---

提前谢谢你

更正

id

您使用的是它的

queryText

而不是

queryText

，并在jQuery选择器中使用单引号代替双引号，如图所示：-

<button type="button" class="btn btn-primary" onclick="Search($('#queryTexte').val())">Search</button>

搜索

不要使用

type=submit

按钮，而是如上所示使用

type=button

。

HTML:

<input id="queryTexte" type="text" /><br>

jQuery：

<script>

jQuery(document).ready(function($){

    $('.btn-primary').click(function(){

    var query_text = $('#queryTexte').val();

            $.get( "http://localhost:9000?query="+query_text, function( data ) {
                     $('#div2').empty();
                     ..............
                     $('#div2').append("</table>");
            }, "json")
        .fail(function() {
               $("#rep")
                   .append('<br/><p style="color:red">Oops! Error with XMLHttpRequest</p>')
            });
      });
});
</script>

jQuery（文档）.ready（函数（$）{
$（'.btn primary'）。单击（函数（）{
var query_text=$（'#querytext'）.val（）；
$.get（”http://localhost:9000?query=“+查询\文本、函数（数据）{
$（'#div2'）.empty（）；
..............
$（'#div2'）。追加（“”）；
}“json”）
.fail（函数（）{
$（“代表”）
.append（“
Oops！XMLHttpRequest出现错误”
）
});
});
});

我会这样做，以保持JS和HTML分开，避免报价问题：

$("button").on("click", function(){
    Search($("#queryTexte").val());
});

如果您的脚本在DOM元素之前加载，请按如下方式包装它以等待DOM就绪：

$(function){
    $("button").on("click", function(){
        Search($("#queryTexte").val());
    });
});

---

chnne button type submit to type=“button”。谢谢你，现在至少我成功地获取了里面的文本，但是当我单击按钮时，我的页面会重新加载。我会更新我的问题@Othmane..您使用的是提交按钮，而不是使用

type=button

，如我的答案所示。