Question

我制作了一个表单，您可以从下拉菜单中选择一个选项。选择选项后，将为文本字段设置值。我还想要发生的是它在值之后关注那个文本字段。例如：我从下拉列表中选择Facebook，“http://www.facebook.com/”显示为文本字段的值。选择Facebook时，焦点也会转到已添加值的最后一个字符后的文本字段。

我用我所拥有的东西制作了一个JSFiddle：

http://jsfiddle.net/dgUrj/

JS：

$(document).ready(function() {
    //Add the right URL prefix for social media
    $('select').change(function() {
        console.log(this.value);
        if(this.value == "Facebook"){
         $('#social-url').val("http://www.facebook.com/");
        }
        if(this.value == "Twitter"){
         $('#social-url').val("http://www.twitter.com/");
        }
        if(this.value == "LinkedIn"){
         $('#social-url').val("http://www.linkedin.com/");
        }
    });

});

Answer 1

只需在设置值后添加focus()触发器，如下所示：

$('#social-url').val("http://www.twitter.com/").focus();

我是这样做的：

$(document).ready(function() {
    $('select').on('change', function() {
         $('#social-url').val("http://www." + this.value.toLowerCase() + ".com/")
                         .focus();
    });
});

FIDDLE

Answer 2

只需在if语句之后放置它，它将在下拉选择发生后自动关注文本框。

   $('#social-url').focus();

所以你的代码看起来像这样：

$(document).ready(function() {
    //Add the right URL prefix for social media
    $('select').change(function() {
        console.log(this.value);
        if(this.value == "Facebook"){
         $('#social-url').val("http://www.facebook.com/");
        }
        if(this.value == "Twitter"){
         $('#social-url').val("http://www.twitter.com/");
        }
        if(this.value == "LinkedIn"){
         $('#social-url').val("http://www.linkedin.com/");
        }
         $('#social-url').focus();
    });

});

演示： http://jsfiddle.net/dgUrj/2/

Answer 3

可以这样简单地完成：

SEE DEMO

$(document).ready(function() {
    //Add the right URL prefix for social media
    $('select').change(function() {
        console.log(this.value);
        if(this.value == "Facebook"){
         $('#social-url').val("http://www.facebook.com/");
        }
        else if(this.value == "Twitter"){
         $('#social-url').val("http://www.twitter.com/");
        }
        else if(this.value == "LinkedIn"){
         $('#social-url').val("http://www.linkedin.com/");
        }

        if(this.value) $('#social-url').focus();
    });

});

使用jquery将文本字段的值聚焦在其值之后

3 个答案: