亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Django - AJAX Fetch 發送每個輸入字母的請求

Django - AJAX Fetch 發送每個輸入字母的請求

鴻蒙傳說 2023-11-02 16:37:03
這可能與應有的方式相去甚遠,我正在不斷學習,這是我第一次嘗試這樣的事情。問題:即使使用 setTimeout 函數,服務器也會為我寫的每個字母發送響應,盡管我希望它等待用戶停止鍵入并只獲取完成的單詞我的模板中的腳本:lookup.addEventListener('keyup', e => {        let searchValue = e.target.value;    if (searchValue.length > 4){      setTimeout(() => {             fetch(`{% url 'find_book' %}?param=${e.target.value}` )          .then(res => res.json())          .then(data => console.log(data))          .catch(err => console.log(err))}, 2000);        }views.py@api_view(['GET'])def find_book(request):    param = request.GET.get("param")    if param:        url = f'https://www.googleapis.com/books/v1/volumes?q=intitle:{param}&key=xxx'        r = requests.get(url)                if r.status_code == 200:            data = r.json()            return Response(data, status=status.HTTP_200_OK)        else:            return Response({"error": "Request failed"}, status=r.status_code)    else:        return Response({}, status=status.HTTP_200_OK)
查看完整描述

1 回答

?
拉莫斯之舞

TA貢獻1820條經驗 獲得超10個贊

將超時 ID 存儲到高于您的事件監聽器范圍內的變量。當事件觸發時 - 檢查是否超時并清除它(這意味著如果尚未執行則取消請求)


例子:


let delayedFetch;


lookup.addEventListener('keyup', e => {

    

    let searchValue = e.target.value;


    if (searchValue.length > 4){


      if (delayedFetch) clearTimeout(delayedFetch);


      delayedFetch = setTimeout(() => {

     

        fetch(`{% url 'find_book' %}?param=${e.target.value}` )

          .then(res => res.json())

          .then(data => console.log(data))

          .catch(err => console.log(err))}, 2000);

        }


查看完整回答
反對 回復 2023-11-02
  • 1 回答
  • 0 關注
  • 126 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號