zookeeper python接口实例详解
202
2023-07-26
分享纯手写漂亮的表单验证
哈哈 手工馒头好吃,今天跟大家分享手工js表单验证代码,感兴趣的朋友快来吧。
因为是自定义样式,所以兼容所有浏览器版本,个人认为非常漂亮:网址wuxi.rongzi.com
css
/*tooltip*//* CSS属性顺序按照 字母首字母 排列*/
.ui-slider-tooltip{ background:#fa; border:px solid #fa; color:#fff; display: block; text-align: left; padding: px px px px; position: absolute; z-index:; }
.ui-corner-all { border-radius: px; -moz-border-radius-bottomleft:px; -moz-border-radius-bottomright:px; -moz-border-radius-topleft:px; -moz-border-radius-topright:px; -webkit-border-top-left-radius:px px; -webkit-border-top-right-radius:px px;-webkit-border-bottom-right-radius:px px; -webkit-border-bottom-left-radius:px px;}
.ui-tooltip-pointer-down { border-bottom-width: ; border-left: px dashed transparent; border-right: px dashed transparent; border-top: px solid #fa; bottom: -px; display: block; height:; left: %; margin-left: -px; position: absolute; width:;}
.ui-tooltip-pointer-down-inner { border-left: px dashed transparent; border-right: px dashed transparent; border-top: px solid #fa; left: -px; top: -px; position: absolute; }
.tip{ font-size:pt; line-height:px;}
.error{ border: px solid rgb(, , );}
前台:
js:
function submitOneClickApply() {
var username = $("#userName").val();
if (username == "" || username == "请输入您的姓名") {
$("#userName").rzAlertTips({ flagInfo: '请输入联系人', isAnimate: true });
}
调用的js:
(function ($) {
jquery.fn.extend({
rzAlertTips: function (settingshttp://) {
$(this).each(function () {
//初始化配置信息
var options = jQuery.extend({
flagCss: "tip",
flagWidth: $(this).outerWidth(),
flagInfo: $(this).attr("title"),
isAnimate: false
},
settings);
if (!options.flagInfo) {
return;
}
$(this).removeAttr("title");
var obj = $(this);
var oToolTip = null;
var fun_show = function () {
//设置提示信息最小宽度为
options.flagWidth = "auto"; // (parseInt(options.flagWidth) < ) ? : parseInt(options.flagWidth);+ "px"
var oTip = $("
");var oPointer = $("
var oTipInfo = $("
//合并提示信息
oToolTip = $(oTip).append(oTipInfo).append(oPointer);
if ($("#tipWrap_" + $(this).attr("id")).length > ) $("#tipWrap_" + $(this).attr("id")).remove();
//添加淡入效果
if (options.isAnimate) {
$(oToolTip).fadeIn("slow");
}
$(obj).after(oToolTip);
//计算提示信息的top、left和width //position.top
var position = $(obj).position();
var oTipTop = eval(position.top - $(oTip).outerHeight() - );
var oTipLeft = position.left;
$(oToolTip).css("top", oTipTop + "px").css("left", oTipLeft + "px");
};
fun_show();
$('.error').removeClass('error');
$(this).addClass("error");
setTimeout(function () { $(oToolTip).remove(); }, );
});
return this;
}
})(jQuery);
以上内容就是给大家分享的纯手写漂亮的表单验证,希望大家喜欢。
版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。
发表评论
暂时没有评论,来抢沙发吧~