如何从输入字段中获取数据到我的 ajax 请求中？

Question

我正在尝试将文本字段中的数据获取到我的 ajax 请求中，以便我可以获得 API 的响应。但是我对JS的经验很少，所以我无法弄清楚。

我正在使用物化框架。

HTML:

<div class="input-field">
    <label for="country">Autocomplete</label>
    <input type="text" id="country" class="autocomplete">
</div>

JS:

$(document).ready(function() {
    //Autocomplete
    $(function() {
      $.ajax({
        type: 'GET',
        url: 'https://sandbox.iexapis.com/stable/search/**{I need the text from what the user has put in here}**?token='myiextoken',
        success: function(response) {...

Answer 1

使用val()获取输入值。

const value = $("#country").val();

并使用 string template literal

$(document).ready(function() {
    //Autocomplete
    const value = $("#country").val();
    $(function() {
      $.ajax({
        type: 'GET',
        url: `https://sandbox.iexapis.com/stable/search/${value}token='myiextoken`,
        success: function(response) {...
          
          */

<div class="input-field">
  <label for="country">Autocomplete</label>
  <input type="text" id="country" class="autocomplete">
  <button> click </button>
</div>

Answer 2

您可以在将 jquery val() method to get the input value, then you need to encode this value using encodeURIComponent 传递到您的 url 之前使用 jquery val() method to get the input value, then you need to encode this value using encodeURIComponent。

$(document).ready(function() {
  //Autocomplete
  $(function() {
    var inputValue = $('#country').val();
    var url = 'https://sandbox.iexapis.com/stable/search/'
              + encodeURIComponent(inputValue)
              + '?token='myiextoken';

    $.ajax({
      type: 'GET',
      url: url,
      ...

Answer 3

如果你想使用原生JavaScript，只需写：

document.getElementById('country').value;

Answer 4

只需添加行

 $.ajax({
    type: 'GET',
    url: "https://sandbox.iexapis.com/stable/search/" + $('#country').val() + "?token='myiextoken'",
    success: function(response) {...

如何从输入字段中获取数据到我的 ajax 请求中？

How do I get data from an input field into my ajax request?

javascript

ajax

materialize