使用javascript自動在onfocus的輸入文本字段中附加值

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;
}
}