如何在Javasript的函式中使用變數？

<script type='text/javascript'/span>>
    $(document).ready(function () {
        $("#q").keyup(function () {
            var value = $('#q'/span>).val()
            $.getJSON("{% url 'api:api-root' %}" "bankdetailapi/? q="/span>   value, function (data) {
                var text = []
                for (var i = 0; i < 5;   i) { text. push(data.results[i].ifsc) }

                //var text = `IFSC: ${data.results.ifsc}`
                if (document.getElementById("q"/span>)。 value.length == 0) { text = [] }
                
                // console.log(text)/span>
                $('#q'/span>).hover(
                    function () {
                        console.log(text)
                        $("q").autocomplete（{
                            source: text,
                            delay: 500。
                        });
                    }, function () {
                        $("#q").自動完成("禁用")。
                    })
            })
        })
    })
</script>

我已經創建了變數text來存盤get請求的結果。我的自動完成功能是在getJSON函式里面。在hover函式中，它沒有列印任何東西，但在外面的陳述句中，當注釋出來時，卻列印了結果。我不明白為什么會發生這種情況。我需要這樣做，以便我的自動完成功能在用戶洗掉所有輸入或不在其上懸停時不會顯示結果。

Update 我把$(this).hover改成了$("#q").hover，因為它將觸發滑鼠所在之處的hover事件。

uj5u.com熱心網友回復：

我認為你可以簡化一下，使用實際的啟用/禁用。 為了清楚起見，我使用了懸停的長形式（mouseenter, mouseleave）

$(function() {
  $("#q").on('keyup'，function() {
    var value = $('#q').val() 。
    /* $.getJSON("{% url 'api:api-root' %}"   "bankdetailapi/?q="   value, function(data) {
       var text = [];
       for (var i = 0; i < 5;   i) {
         text.push(data.results[i].ifsc)。
       }

       // var text = `IFSC: ${data.results.ifsc}`.
       如果（document.getElementById("q").value.length == 0） {
         text = [];
       }
     });
     */
  }).on('mouseenter'，function() {
    console.log("Initial:", $（this）.val（）。
    $(this).autocomplete("enable") 。
  }).on("mouseleave"/span>, function() {
    //這將破壞自動完成（不選擇一個值），所以你必須手動完成。
    //$(this).autocomplete("disable");。
  }).autocomplete（{
    source: [{ {
      label: "Choice1",
      value: "value1"。
    }, {
      label: "Choice2",
      value: "value2"。
    }, {
      label: "party",
      value: "啤酒".
    }],
    delay: 500,
    select: function(event, selectedObject) {
      jQuery(this).val（selectedObject.item.value）。
    }
  });
});

.ui-autocomplete {
  position: absolute;
  cursor: default;
  z-index: 1001 !
}

.ui-front {
  z-index: 1500 ！ important;
}

< link rel="styleheet" href="https: //cdnjs. cloudflare. com/ajax/libs/jqueryui/1.12.1/themes/cupertino/jquery-ui.min. css" integrity="sha512- ug/p2fTnYRx/TfVgL8ejTWolaq93X 48/FLS9fKf7AiazbxHkSEENdzWkOxbjJO/X1grUPt9ERfBt21iLh2dxg==" crossorigin="anonymous"/span>
  referrerpolicy="no-referrer"/span> />
<link rel=" stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/cupertino/theme.min. css" integrity="sha512- adRIgePtMQgAVB Mfkhl Nyva/WllWlFzJyyhYCjznU3Di Z4SsYi1Rqsep11PYLpUsW/SjE4NXUkIjabQJCOQ==" crossorigin="anonymous" referrerpolicy="no-referrer" 
/>
<script src="https://cdnjs. cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>/span>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min. js" integrity="sha512- uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy D176RYoop1Da f9mvkYrmj5MCLZWEtQuA=="/span> crossorigin="anonymous" referrerpolicy="no-referrer"> </script>>

<div class="ui-widget">/span>
  <label for="q">/span>Tags。</label>
  < input id="q" type="text">
</div>/span>

uj5u.com熱心網友回復：

考慮一個替代的例子。

$(function() {
  $("#q").autocomplete({
    source: function(request, response) {
      var myUrl = "{% url 'api:api-root' %}"/span>   "bankdetailapi/"/span>。
      $.ajax（{
        url: myUrl,
        data: {
          q: request.term。
        },
        success: function(data) {
          var text = [];
          $.each(data.results, function(i, res) {
            if (i < 5) {
              text.push（res.ifsc）。
            }
          });
          response（text）。
        }
      })
    },
    delay: 500,
    minLength: 0.
  }).hover(function(/span>) {
    if ($(this).val() != " ") {
      $(this)。 自動完成("search", $(this).val()。
    }
  }, function() {
    $(this).autocomplete("close") 。
  });
});

.ui-autocomplete {
  position: absolute;
  cursor: default;
  z-index: 1001 !
}

.ui-front {
  z-index: 1500 ！ important;
}

< link rel="styleheet" href="/code. jquery.com/ui/1.12.1/themes/base/jquery-ui.css">/span>
<script src="https://code. jquery.com/jquery-1.12.4.js"></script>
<script src="https://code. jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="ui-widget">/span>
  <label for="q">/span>Tags。</label>
  < input id="q" type="text">
</div>/span>

查看更多。https://api.jqueryui.com/autocomplete/

標籤：

上一篇：使用jquery選擇某些html代碼進行洗掉

下一篇：如何在jquery中把for回圈中的i傳給id標簽？