jquery 如果文本框内容在X秒内未更改，则进行后调用

yzuktlbb 于 2023-01-25 发布在 jQuery

关注(0)|答案(1)|浏览(128)

下面的代码块使用jQuery将id为searchBox的文本输入的内容发送到服务器。

$(document).ready(function () {    
  $('#searchBox').on('input', function () {
    var searchContent = $(this).val()

    if (searchContent.length == 0) {
      // other not relevant code
    }
    else {    
   

        $.post('/checkAvailability',
          { domainName: searchContent },
          function (data, status, jqXHR) {
            console.log(status + ' ' + data);
          });

    }
  });
});

如果搜索内容在3秒内没有变化，如何才能调用$.post函数？

jquery

来源：https://stackoverflow.com/questions/75190770/make-post-call-if-text-box-content-has-not-changed-for-x-seconds

1条答案

按热度按时间

2nbm6dog1#

如果不使用lodash.throttle或lodash.debounce之类的其他实现，您可以使用setTimeout和clearTimeout。
（我注解掉了对$.post的调用，只在演示中使用了console.log()调用）

$(document).ready(function() {
  let run;

  $("#searchBox").on("input", function() {
    const searchContent = $(this).val();
    clearTimeout(run);

    if (searchContent.length == 0) {
      // other not relevant code
    } else {
      run = setTimeout(() => {
        console.log(searchContent);
        /* $.post(
          "/checkAvailability", {
            domainName: searchContent
          },
          function(data, status, jqXHR) {
            console.log(status + " " + data);
          }
        ); */
      }, 3000);
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="searchBox" />

赞(0）回复(0）举报 2023-01-25

我来回答

jquery 如果文本框内容在X秒内未更改，则进行后调用

1条答案

相关问题

热门标签

最新问答