javascript - 在用户输入时抓取文本输入

Question

我正在尝试使用输入文本字段中的数据即时更新 span 标签。基本上我有一个文本字段，我希望能够在用户输入时获取他们的输入，并在该字段下方的 span 标记中显示给他们。

代码:

<input id="profileurl" type="text">
<p class="url">http://www.randomsite.com/<span id="url-displayname">username</span></p>

JQuery:

var username;

$('#profileurl').keyup(function(username);
$("#url-displayname").html(username);

在 JS Fiddle 中查看:http://jsfiddle.net/pQ3j9/

我猜 keyup 函数不是执行此操作的最佳方法。因为检查 key 将无法获取预填充或粘贴的表单输入。

理想情况下，有一些神奇的 jQuery 函数可以在检测到按下键时输出框中的任何信息，但如果该方法存在我还没有找到它。

编辑:你们真是太棒了。看起来 .val() 就是那个神奇的方法。

第二个问题:您将如何限制输入？查看修改后的 jsfiddle，当用户输入像 < hr > 这样的 html 标记时，浏览器会解释它并破坏表单。你指定一个数组然后检查它吗？ jquery 有类似 PHP 的 strip_tags 函数吗？

Answer 1

$('#profileurl').keyup(function(e) {
    $("#url-displayname").html($(this).val());
}).keypress(function(e) {
    return /[a-z0-9.-]/i.test(String.fromCharCode(e.which));
});

查看修改后的jsfiddle:
http://jsfiddle.net/roberkules/pQ3j9/5/

更新:正如@GregL 指出的那样，keyup 确实更好，(否则，例如根本不处理退格)。