Question

给出以下javascript（jquery）

        $("#username").keyup(function () {
            selected.username = $("#username").val();

            var url = selected.protocol +
                (selected.prepend == true ? selected.username : selected.url) + "/" +
                (selected.prepend == true ? selected.url : selected.username);

            $("#identifier").val(url);
        });

此代码基本上读取文本框（用户名），当输入时，它会重新构建在另一个文本框（标识符）中显示的URL。

这很好用 - 它的功能没有问题。然而，它感觉“缓慢”和“迟钝”。有没有更清洁/更快的方法来完成这项任务？

这是请求的HTML。

<fieldset class="identifier delta">
    <form action="/authenticate/openid" method="post" target="_top" >
        <input type="text" class="openid" id="identifier" name="identifier" readonly="readonly" />
        <input type='text' id='username' name='username' class="left" style='display: none;'/>
        <input type="submit" value="Login" style="height: 32px; padding-top: 1px; margin-right: 0px;" class="login right" />
    </form>
</fieldset>

标识符文本框只有一个基于按钮的超链接锚点设置的值。

Answer 1

缓存你的jquery对象......

var username = $('#username'),
    identifier = $('#identifier');

username.keyup(function () {
    selected.username = username.val();

    var url = selected.protocol +
        (selected.prepend == true ? selected.username : selected.url) + "/" +
        (selected.prepend == true ? selected.url : selected.username);

    identifier.val(url);
});

您目前正在每次击键时搜索dom两次。

Answer 2

除了从较少的IF保存以外，我没有看到任何可能的优化。

var url = selected.protocol + (selected.prepend == true ? selected.username + '/' + selected.url : selected.url + '/' + selected.username);

Answer 3

是的，正如其他人已经表明的......我能看到的唯一优化就是将对象移到函数之外：

var url = selected.protocol;
var iden = $("#identifier");
$("#username").keyup(function() {
 selected.username = $(this).val();
 iden.val( url + (selected.prepend == true ? selected.username + '/' + selected.url : selected.url + '/' + selected.username) );
})

更快的Javascript文本替换

3 个答案: