需要添加此引用
用户名一行的 html 代码是:
复制代码 代码如下:
用户名:
*
然后在 js 中添加如下代码:
复制代码 代码如下:
$('#htbxusername').jcallout(
'initwithoutshow',{
message: 必填项!,
position: right,
backgroundcolor: #f00,
textcolor: #fff,
showeffect: fade,
showspeed: 300,
hideeffect: fade,
hidespeed: 300,
$closeelement: $('')
});
需要注意的是 jcallout 有两种初始化的方法:init 和 initwithoutshow,前者初始化后就会立即显示气泡,后者不会立即显示,要在需要时添加代码显示:
复制代码 代码如下:
var $usernameinput = $(#htbxusername);
$usernameinput.blur(function() {
if($usernameinput.val().length==0){
$usernameinput.jcallout('show');
}
});
参数 $closeelement 是设置气泡的关闭按钮,看插件源码会发现
复制代码 代码如下:
$closeelement: $('(x)'),
如果不设置 $closeelement: $('') 的话,会出现如下显示,并且,点击 (x) 可以关闭气泡:
另外,该气泡同样可以显示图片,将图片的 html 代码写入 message 参数即可:
复制代码 代码如下:
message: 必填项!
