使用javascript在焦点上自动添加值在输入文本字段中

Question

在创建表单中，用户键入他的姓名，然后输入他的姓，并且当他专注于用户名文本字段时，必须自动附加surname.name字符串。 换句话说，使用JavaScript，一旦USERNAME输入文本字段接收焦点，NAME & SURNAME输入文本字段的值必须被自动附加到它，并分离由点（。）= surname.name

 <h:outputLabel value="#{bundle.CreateUsersLabel_name}" for="name" /> 
        <h:inputText id="name" value="#{usersController.selected.name}" title="#{bundle.CreateUsersTitle_name}" /> 
        <h:outputLabel value="#{bundle.CreateUsersLabel_surname}" for="surname" /> 
        <h:inputText id="surname" value="#{usersController.selected.surname}" title="#{bundle.CreateUsersTitle_surname}" /> 
<h:outputLabel value="#{bundle.CreateUsersLabel_username}" for="username" /> 
        <h:inputText id="username" value="#{usersController.selected.username}" title="#{bundle.CreateUsersTitle_username}" required="true" requiredMessage="#{bundle.CreateUsersRequiredMessage_username}"/> 

有什么想法吗？

Answer 1

这里是一个小的演示，我提出希望这是你在找什么

name: <input id="name" /> <br> 
surname: <input id="surname" /><br> 
username: <input onfocus="input()" id="username" /> 

那些被输入，这里是被调用的onfocus在用户名字段

function input(){ 
var name = document.getElementById('name').value; 
var surname = document.getElementById('surname').value; 
var username = ''; 

//only fill in the field if name and surname are entered 
if(name != '' && surname != ''){ 
    username = name+'.'+surname; 
    document.getElementById('username').value = username; 
} 
}