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

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函数不是最好的方法.由于检查密钥将无法获取预填充或粘贴的表单输入.

理想情况下,有一些神奇的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确实更好,(否则,例如根本不处理退格).