常用表单JS代码

来源:互联网 发布:arcgis js 热点格网图 编辑:程序博客网 时间:2024/05/22 02:21
                            <form onsubmit="return false;"><div class="form-group" id="f_1485165301182">                                            <div class="label">                                                <label for="f_username_txt">                                                    用户名/账号                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_username_txt" name="f_username_txt" maxlength="50" value="" data-validate="required:请填写用户名/账号,username:请输入英文字母开头的字母、下划线、数字,ajax#(demo/getdata.html?username={value}):该账号已存在,length#<50:字数在0-50个" placeholder="英文字母开头的字母、下划线、数字">                                            <div class="input-help"><ul><li>请填写用户名/账号</li><li>请输入英文字母开头的字母、下划线、数字</li><li>该账号已存在</li></ul></div></div>                                        </div><div class="form-group" id="f_1485165302301">                                            <div class="label">                                                <label for="f_password_txt">                                                    密码                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_password_txt" name="f_password_txt" maxlength="50" value="" data-validate="required:请填写密码,username:请输入英文字母开头的字母、下划线、数字,length#<50:字数在0-50个" placeholder="英文字母开头的字母、下划线、数字">                                            <div class="input-help"><ul><li>请填写密码</li><li>请输入英文字母开头的字母、下划线、数字</li></ul></div></div>                                        </div><div class="form-group" id="f_1485165304286">                                            <div class="label">                                                <label for="f_email_txt">                                                    电子邮箱                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_email_txt" name="f_email_txt" maxlength="50" value="" data-validate="required:请填写密码,email:请输入Email,如:1979788761@qq.com,length#<50:字数在0-50个" placeholder="请输入电子邮箱">                                            </div>                                        </div><div class="form-group" id="f_1485165305598">                                            <div class="label">                                                <label for="f_qq_txt">                                                    QQ号码                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_qq_txt" name="f_qq_txt" maxlength="11" value="" data-validate="required:请填写QQ号码,qq:请输入QQ号码,如:1979788761,length#<11:字数在0-11个" placeholder="请输入QQ号码">                                            </div>                                        </div><div class="form-group" id="f_1485165307382">                                            <div class="label">                                                <label for="f_mobile_txt">                                                    手机号                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_mobile_txt" name="f_mobile_txt" maxlength="11" value="" data-validate="required:请填写内容,mobile:请输入手机号码" placeholder="输入手机号码">                                            </div>                                        </div><div class="form-group" id="f_1485165308271">                                            <div class="label">                                                <label for="f_phone_txt">                                                    联系电话                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_phone_txt" name="f_phone_txt" maxlength="12" value="" data-validate="required:请填写联系电话,phone:请输入联系电话" placeholder="输入联系电话">                                            </div>                                        </div><div class="form-group" id="f_1485165309166">                                            <div class="label">                                                <label for="f_tel_txt">                                                    手机号/电话号                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_tel_txt" name="f_tel_txt" maxlength="12" value="" data-validate="required:请填写手机号/电话号,tel:请输入手机号/电话号" placeholder="输入手机号码/联系电话">                                            </div>                                        </div><div class="form-group" id="f_1485165314726">                                            <div class="label">                                                <label for="f_englishname_txt">                                                    英文名                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_englishname_txt" name="f_englishname_txt" maxlength="161" value="" data-validate="required:请填写英文名,englishname:请输入英文名,1到161个字母" placeholder="输入英文名">                                            <div class="input-help"><ul><li>请填写英文名</li><li>请输入英文名,1到161个字母</li></ul></div></div>                                        </div><div class="form-group" id="f_1485165318631">                                            <div class="label">                                                <label for="upfile">                                                    照片/头像                                                </label>                                            </div>                                            <div class="field">                                                <a class="button input-file" href="javascript:void(0);">                                                    + 请选择上传文件                                                    <input size="100" data-validate="required:请选择文件,img:只能上传jpg|gif|png|ico格式文件" type="file">                                                </a>                                            <div class="input-help"><ul><li>请选择文件</li><li>只能上传jpg|gif|png|ico格式文件</li></ul></div></div>                                        </div><div class="form-group" id="f_1485165320814">                                            <div class="label">                                                <label for="f_age_txt">                                                    年龄                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_age_txt" name="f_age_txt" maxlength="2" value="" data-validate="required:请填写年龄,age:请输入年龄,1到99岁" placeholder="输入年龄">                                            </div>                                        </div><div class="form-group" id="f_1485165321672">                                            <div class="label">                                                <label for="f_date_txt">                                                    出生日期                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_date_txt" name="f_date_txt" maxlength="2" value="" data-validate="required:请填选择日期,date:请输入日期,如:2015-05-06" placeholder="输入日期">                                            </div>                                        </div><div class="form-group" id="f_1485165322462">                                            <div class="label">                                                <label for="f_idcard_txt">                                                    身份证号                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_idcard_txt" name="f_idcard_txt" maxlength="2" value="" data-validate="required:请填写身份证号码,idcard:请输入18位身份证号码" placeholder="输入身份证号码">                                            </div>                                        </div><div class="form-group" id="f_1485165334174">                                            <div class="label">                                                <label for="f_zipcode_txt">                                                    邮政编码                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_zipcode_txt" name="f_zipcode_txt" maxlength="6" value="" data-validate="required:请填写邮政编码,zipcode:请输入邮政编码" placeholder="请输入邮编">                                            </div>                                        </div><div class="form-group" id="f_1485165335919">                                            <div class="label">                                                <label for="f_address_txt">                                                    常用地址                                                </label>                                            </div>                                            <div class="field">                                                <textarea type="text" class="input" id="f_address_txt" name="f_address_txt" maxlength="500" value="" data-validate="" placeholder="请输入常用地址"></textarea>                                            </div>                                        </div><div class="form-group" id="f_1485165337502">                                            <div class="label">                                                <label for="f_url_txt">                                                    个人主页                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_url_txt" name="f_url_txt" maxlength="50" value="" data-validate="required:请填写网址,zipcode:请输入网址,以http开头" placeholder="请输入网址">                                            </div>                                        </div><div class="form-group" id="f_1485165341402">                                            <div class="label">                                                <label for="f_ip_txt">                                                    登录IP                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_ip_txt" name="f_ip_txt" maxlength="50" value="" data-validate="required:请填写IP,ip:请输入IP地址,如:192.168.1.1" placeholder="请输入IP地址">                                            </div>                                        </div><div class="form-group" id="f_1485165344767">                                            <div class="label">                                                <label for="f_work">                                                    工作                                                </label>                                            </div>                                            <div class="field">                                                <div class="button-group radio">                                                    <label class="button active">                                                        <input id="f_work1" name="f_work" value="yes" checked="checked" type="radio" data-validate="required:请选择,length#>=1:至少选择1项"><span class="icon icon-check"></span> 有                                                    </label>                                                    <label class="button">                                                        <input id="f_work0" name="f_work" value="no" type="radio" data-validate="required:请选择,length#>=1:至少选择1项"><span class="icon icon-times"></span> 无                                                    </label>                                                </div>                                            </div>                                        </div><div class="form-group" id="f_1485165345615">                                            <div class="label">                                                <label for="f_class">                                                    学历                                                </label>                                            </div>                                            <div class="field">                                                <select class="input" id="f_class" name="f_class" data-validate="required:请选择,length#>=1:至少选择1项">                                                    <option>大专</option>                                                    <option>中专</option>                                                    <option>本科</option>                                                </select>                                            </div>                                        </div><div class="form-group" id="f_1485165353144">                                            <div class="label">                                                <label for="f_currency_txt">                                                    月收入                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_currency_txt" name="f_currency_txt" maxlength="10" value="" data-validate="required:请填写月收入,currency:请输入月收入,1到99岁,length#<10:字数在0-10个" placeholder="输入月收入">                                            </div>                                        </div><div class="form-group" id="f_1485165355918">                                            <div class="label">                                                <label for="f_datetime_txt">                                                    注册时间                                                </label>                                            </div>                                            <div class="field">                                                <input type="text" class="input" id="f_datetime_txt" name="f_datetime_txt" maxlength="2" value="" data-validate="required:请填选择日期时间,datetime:请输入日期时间,如:2015-05-06 00:00:00" placeholder="选择日期时间">                                            </div>                                        </div><div class="form-group" id="f_1485165360492">                                            <div class="label">                                                <label for="passcode">                                                    验证码                                                </label>                                            </div>                                            <div class="field">                                                <div class="button-group">                                                    <input type="text" class="input float-left" name="passcode" placeholder="填写右侧的验证码" data-validate="required:请填写右侧的验证码" style="width: 65%;">                                                    <img src="http://www.pintuer.com/demo/pintuer2/images/passcode.jpg" width="80" height="32" class="passcode">                                                </div>                                            <div class="input-help"><ul><li>请填写右侧的验证码</li></ul></div></div>                                        </div><div class="form-group" id="f_1485165364942">                                            <button class="button bg-yellow form-reset type=" reset="" "="">                                                重设                                            </button>                                        </div><div class="form-group" id="f_1485165365614">                                            <div class="alert alert-red">                                                <span class="close rotate-hover"></span><strong>操作失败</strong>                                                <p>                                                    请重新操作。                                                </p>                                                <button class="button bg-red">                                                    确认                                                </button>                                                <button class="button bg-yellow form-reset" type="reset">                                                    重设                                                </button>                                            </div>                                        </div><div class="form-group" id="f_1485165366998">                                            <div class="alert alert-yellow">                                                <span class="close rotate-hover"></span><strong>注意:</strong>请按照要求填写内容。                                            </div>                                        </div><div class="form-group" id="f_1485165367670">                                            <div class="alert alert-blue">                                                <span class="close rotate-hover"></span><strong>提示:</strong>请按照要求填写内容。                                            </div>                                        </div><div class="form-group" id="f_1485165368271">                                            <div class="alert alert-green">                                                <span class="close rotate-hover"></span><strong>恭喜:</strong>操作成功。                                            </div>                                        </div></form>                        

0 0