Jquery实时输入

jquery live typing

本文关键字：实时输入 Jquery      更新时间：2023-09-26

想要了解我在说什么，请查看这个链接

所以，我想摆脱输入框，我的意思是在一个红色背景的div上键入一些东西，例如，当我键入google并按回车键时，我想将我发送到google网站，当我键入yahoo时，将我发送到yahoo网站。我怎样才能做到这一点?我不太擅长javascript。谢谢!

这可能有帮助。

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('div[contenteditable]').focus();
    $('div[contenteditable]').keypress(function (e) {
    if(e.which == 13) 
    {
       switch ($(this).html()) {
        case 'google':
            document.location = 'http://google.com'
            break;    
        case 'yahoo':
            document.location = 'http://yahoo.com'
            break;
          } 
    } 
    });
});
</script>
<style>
div[contenteditable] { background:red; width:200px;height:20px; padding:5px; }
</style>
</head>
<body>
<div contenteditable></div>
</body>
</html>

您可以在页面上添加一个具有CONTENTEDITABLE="true"属性的div。然后添加一个按钮或任何指示用户完成操作的东西(也可以是点击返回键)。此时，检查div中的值，如果需要显示错误消息，或者如果输入的值有效则重定向页面(例如document.location.href = 'http://www.' + userValue + '.com';)

你也可以通过css隐藏你的输入，这样看起来你是在写一个div，但实际上它只是一个适当样式的输入。

修改后的版本

像这样?

http://jsfiddle.net/9mNc4/3/

相关文章：