用于输入用户信息的动态PHP代码

时间:2014-10-09 11:43:22

标签: javascript php jquery html

我正在使用PHP表单输入用户信息。我有以下三个重要字段:名字,姓氏和电子邮件。我需要做的是在用户输入前两个字段时和保存之前自动设置电子邮件。例如,当用户键入' First'在名字和'最后'在姓氏字段中,电子邮件字段应自动显示First.Last@example.com。

代码已经编写完成,这是我正在处理的部分:

echo '<TABLE ><TR><TD >'.TextInput($student['FIRST_NAME'],'students[FIRST_NAME]','<FONT color=red>'._('First').'</FONT>','size=12 class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.TextInput($student['MIDDLE_NAME'],'students[MIDDLE_NAME]',''._('Middle').'','class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.TextInput($student['LAST_NAME'],'students[LAST_NAME]','<FONT color=red>'._('Last').'</FONT>','size=12 class=cell_floating maxlength=50 style="font-size:14px; font-weight:bold;"').'</TD><TD>'.SelectInput($student['NAME_SUFFIX'],'students[NAME_SUFFIX]',''._('Suffix').'',array('Jr.'=>'Jr.','Sr.'=>'Sr.','II'=>'II','III'=>'III','IV'=>'IV','V'=>'V'),'','style="font-size:14px; font-weight:bold;"').'</TD></TR></TABLE>';

else
echo '<DIV id=student_name><div style="font-size:14px; font-weight:bold;" onclick=\'addHTML("<TABLE><TR><TD>'.str_replace('"','\"',TextInput($student['FIRST_NAME'],'students[FIRST_NAME]','','maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',TextInput($student['MIDDLE_NAME'],'students[MIDDLE_NAME]','','size=3 maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',TextInput($student['LAST_NAME'],'students[LAST_NAME]','','maxlength=50 style="font-size:14px; font-weight:bold;"',false)).'</TD><TD>'.str_replace('"','\"',SelectInput($student['NAME_SUFFIX'],'students[NAME_SUFFIX]','',array('Jr.'=>'Jr.','Sr.'=>'Sr.','II'=>'II','III'=>'III','IV'=>'IV','V'=>'V'),'','style="font-size:14px; font-weight:bold;"',false)).'</TD></TR></TABLE>","student_name",true);\'>'.$student['FIRST_NAME'].' '.$student['MIDDLE_NAME'].' '.$student['LAST_NAME'].' '.$student['NAME_SUFFIX'].'</div></DIV>';
echo'</td></tr>';


echo '<tr><td>'._('Email').'</td><td>:</td><td>'.TextInput($student['EMAIL'],'students[EMAIL]','','size=100 class=cell_medium maxlength=100').'</td></tr>';

我不知道我应该如何编辑它或在哪里添加jquery代码:/ 感谢您的帮助,谢谢:)

3 个答案:

答案 0 :(得分:1)

这不需要任何ajax。

使用jQuery blur函数进行测试,用户是否留下了文本输入字段(或使用keyup),并测试,是填充的第一个/最后一个名称。如果是,那么您可以使用val()函数获取字段的值,然后您可以生成电子邮件,并设置电子邮件字段的值。

你需要这样的东西:

$('#firstName', '#lastName').keyup(function() {
    var domain = 'example.com';
    var email = $('#firtName').val() + '.' + $('#lastName').val() + '@' + domain;
    $('#email').val(email);
});

答案 1 :(得分:1)

你不需要ajax,看看 DEMO

$('body').on('blur', '.firstname, .lastname', function(){
    var fname = $.trim($('.firstname').val()), 
        lname = $.trim($('.lastname').val()), 
        email = $('#email'), 

        // Set your domain name here
        prefix = '@example.com';

    if( fname != "" && lname != "" )
        email.val( fname + '.' + lname + prefix );
    else if( fname == "" && lname == "" )
        email.val("");
    else 
        email.val( (fname != "" ? fname : lname) + prefix );

});

答案 2 :(得分:1)

HTML

First Name : <input type="text" id="firstName" value=""><br />
Last Name : <input type="text" id="lastName" onchange="createEmail()"><br />
Email : <input type="text" id="email">

的Javascript

<script>
function createEmail() {
    var fn = document.getElementById("firstName").value;
    var ln = document.getElementById("lastName").value;
    document.getElementById("email").value = fn+"."+ln+"@example.com";
}
</script>