代码之家  ›  专栏  ›  技术社区  ›  Cymro

如何将jquery$(this)与$(document).keyup一起使用

  •  0
  • Cymro  · 技术社区  · 2 月前

    我有这个代码:

    $(document).keyup( function(e) {
      console.log($(this).attr('id'));
    });
    

    当键入带有id的HTML输入标记时,console.log中的输出为:

    undefined
    

    那么,如何在keyup函数中使用$(this)呢?

    1 回复  |  直到 2 月前
        1
  •  2
  •   David    2 月前

    事件对象具有 target 可用于此目的的属性:

    $(document).keyup( function(e) {
      console.log($(e.target).attr('id'));
    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <input type="text" id="foo">

    你甚至可以更进一步,远离 .keyup() 而是标准化 .on() ,这可以更清楚地了解事件委托。例如:

    $(document).on('keyup', 'input', function(e) {
      console.log($(this).attr('id'));
    });
    <脚本src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js“></script>
    <输入类型=“text”id=“foo”>

    在上述情况下,第二个论点是 .on() 是一个选择器,用于在运行时确定发起元素是否应触发事件处理程序,以及在事件处理程序内 this 指的是该原始元素。