我很快就制作了这个表单助手来引导用户完成注册表单
它适用于名称和用户名,但我想知道如何扩展它,以便除了名称之外的所有字段都被禁用。
一旦名称有一个值,只有用户名也被启用(这到目前为止有效)然后一旦用户名有一个值,密码将被启用,依此类推。
表单字段是名称、用户名、密码、密码确认和电子邮件
这是代码
$(function() {
var helper = function() {
if ( $('#name').val() == "" ) {
$('#username').attr("disabled", "disabled");
$('#helper').text("Hi there! let's start by entering your name!");
} else {
$('#username').removeAttr('disabled');
$('#helper').text("Great, now choose a username.");
}
};
$('.input-xlarge').keyup(helper).change(helper);
});
干杯
添加了标记
<form class="form" method="post" action="sign_up.php" id="sign-up-form">
<fieldset>
<div class="control-group">
<label class="control-label" for="name"><?php _e('Full name'); ?></label>
<div class="controls">
<input type="text" class="input-xlarge" id="name" name="name" value="<?php echo $signUp->getPost('name'); ?>" placeholder="<?php _e('Full name'); ?>">
</div>
</div>
<div class="control-group" id="usrCheck">
<label class="control-label" for="username"><?php _e('Username'); ?></label>
<div class="controls">
<input type="text" class="input-xlarge" id="username" name="username" maxlength="15" value="<?php echo $signUp->getPost('username'); ?>" placeholder="<?php _e('Choose your username'); ?>">
</div>
</div>
<div class="control-group">
<label class="control-label" for="password"><?php _e('Password'); ?></label>
<div class="controls">
<input type="password" class="input-xlarge" id="password" name="password" placeholder="<?php _e('Create a password'); ?>">
</div>
</div>
<div class="control-group">
<label class="control-label" for="password_confirm"><?php _e('Password again'); ?></label>
<div class="controls">
<input type="password" class="input-xlarge" id="password_confirm" name="password_confirm" placeholder="<?php _e('Confirm your password'); ?>">
</div>
</div>
<div class="control-group">
<label class="control-label" for="email"><?php _e('Email'); ?></label>
<div class="controls">
<input type="email" class="input-xlarge" id="email" name="email" value="<?php echo $signUp->getPost('email'); ?>" placeholder="<?php _e('Email'); ?>">
</div>
</div>
<div class="control-group">
<?php $signUp->profileSignUpFields(); ?>
</div>
<div class="control-group">
<?php $signUp->doCaptcha(true); ?>
</div>
</fieldset>
<input type="hidden" name="token" value="<?php echo $_SESSION['user']['token']; ?>"/>
<button type="submit" class="medium orange"><?php _e('Create my account'); ?></button>
</form>