【问题标题】:onkeypress event not firingonkeypress 事件未触发
【发布时间】:2012-11-16 04:10:18
【问题描述】:

我已经编写了一个同时处理鼠标和键盘事件的代码。但是onkeypress 事件在Firefox、IE 等中没有触发。我也尝试过keydown 事件,但这不起作用。 li 元素的 HTML 代码是:

print "<li class=\"ui-menu-item \" id=\"toli$i\"  value=\"'$name','$email'\" role=\"menuitem\"><a class=\"ui-corner-all\" href=\"#\"  onkeypress=\"keyhandle('$name','$email');\" onclick=\"fillto('toli$i','$name','$email');\">$ename $ediv $email></a></li>";
    }
    elsif($field eq "cc"){

 print "<li class=\"ui-menu-item \" id=\"toli\" role=\"menuitem\"><a class=\"ui-corner-all\" href=\"#\" onkeypress=\"keyhandle('$name','$email');\" onclick=\"fillcc('$name','$email');\">$ename $ediv $email></a></li>";
}
elsif($field eq "bcc"){

 print "<li class=\"ui-menu-item \" id=\"toli\" role=\"menuitem\"><a class=\"ui-corner-all\" href=\"#\" onkeypress=\"keyhandle('$name','$email');\" onclick=\"fillbcc('$name','$email');\">$ename $ediv $email></a></li>";
}
}
print "</ul>";

javascript函数是

<script language="javascript">
function keyhandle(id,name,email){

alert (id);
 }
</script>

onclick 事件正在触发,但 onkeypress 没有触发。谁能建议这是为什么?

提供给浏览器的代码是

<div id="displayto" class="display ui-widget"><ul class="ui-autocomplete ui-menu ui-widget-content ui-corner-all " style="width: 550px; max-height: 200px;" aria-activedescendant="ui-active-menuitem" role="listbox"><li class="ui-menu-item " id="toli1" value="'AMAL SMITHA S','amal_smitha@vssc.gov.in'" role="menuitem"><a class="ui-corner-all" href="#" onkeypress="keyhandle('AMAL SMITHA S','amal_smitha@vssc.gov.in');" onclick="fillto('toli1','AMAL SMITHA S','amal_smitha@vssc.gov.in');">"AMAL SMITHA S" (COM) &lt; amal_smitha@vssc.gov.in&gt;</a></li></ul></div>

我已经尝试过代码

 $(document).ready(){
        $("#displayto").keypress(function(){
            alert('a');
    });
} 

但它也不起作用。我给每个

  • 项。我想通过 keypress 函数传递这个连续的 id。这个 id 值用于在“向下”箭头按下时获取下一个 id 值,在向上箭头按下时获取上一个值。如果按下回车键,则调用 fillto() 函数。此代码用于自动完成功能。有没有其他方法可以做到这一点?请帮助解决这个问题。
  • 【问题讨论】:

    • 我认为onkeypress 仅适用于文本类型的输入,例如type="text"&lt;textarea&gt;
    • @bdares — 不是。 onkeypress 事件在元素上按下和释放键时发生。该属性可用于大多数元素。w3.org/TR/html4/interact/scripts.html#h-18.2.3
    • @Smitha Abhilash — 您正在从 Perl 生成 HTML 和 JavaScript,而 HTML/JavaScript 不起作用。请向我们展示浏览器获取的代码,而不是生成它的代码片段。
    • 当您向我们展示的代码中没有使用该库时,为什么将其标记为 jQuery
    • 您使用什么程序来测试您的代码?你如何聚焦锚点? (你还记得这样做吗?)

    标签: jquery html


    【解决方案1】:

    这可能有点太晚了,但现在我正在处理同样的问题并且可能找到了解决方案。

    我的情况是:

    <span onclick="javascript: /* some javascript to select element */ " onkeypress="javascript: /* call function to process key event */">...</span>
    

    我在某处发现,要使元素能够捕捉关键事件,它需要可聚焦。默认情况下,所有输入元素都应该是可聚焦的,也许其他一些元素也是可聚焦的,因浏览器而异。

    但是,您可以使元素具有焦点,在我的例子中,我使用 tabindex 属性来实现这一点。像这样:

    <span tabindex="" onclick="javascript: /* some javascript to select element */ " onkeypress="javascript: /* call function to process key event */">...</span>
    

    这在 Firefox 中有效,但在 Chrome 中无效。只有当我将一些值放入 tabindex 属性时,该事件才真正被触发并执行 onkeypress="" 中的 javascript。

    所以现在我得到了这样的结果:

    <span tabindex="0" onclick="javascript: /* some javascript to select element */ " onkeypress="javascript: /* call function to process key event */">...</span>
    

    编辑: 我忘了补充一点,您实际上需要关注元素。我通过调用 focus() 在 onclick="" 中做到了这一点。

    【讨论】:

    • 谢谢。做得好!这是我的版本:
    【解决方案2】:

    你会使用 jQuery 吗?如果可以的话,试试这样的,我认为可能会更好:

    $(document).ready(){
        $("#displayto").keypress(function(){
            alert('a');
        });
    }//end of document ready
    

    【讨论】:

      【解决方案3】:

      可能事件是在输入之前加载的,这就是为什么不工作,试试直播吧,

      $(document).ready(){
      
              $('input').live('keypress', function (e) {
                 if ( e.keyCode == 9 ){
                     alert( 'Tab pressed' );
                  }else
                    alert("another key pressed");
              });
      }
      

      如果您不使用输入标签,请尝试使用您正在使用的标签,例如 div 的 id

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2019-12-02
        • 2018-08-16
        • 1970-01-01
        • 2011-12-01
        • 1970-01-01
        • 2014-02-18
        • 2010-11-08
        • 2019-01-31
        相关资源
        最近更新 更多