jCallout はバブル プロンプト function_jquery を簡単に実装します

jCallout のダウンロード アドレス: https://github.com/anupamsmaurya/jCallout

この参照を追加する必要があります

ユーザー名行の HTML コードは次のとおりです:

コードをコピー コードは次のとおりです。

< td class= "columnName">ユーザー名:

次に、js に次のコードを追加します。

コードをコピー コードは次のとおりです:

$('#hTbxUserName').jCallout (
'initWithoutShow',{
メッセージ: "必須!"、
位置: "右"、
背景色: "#f00"、
テキスト色: "#fff"、
showEffect: "フェード",
showSpeed: 300,
HideEffect: "フェード",
HideSpeed: 300,
$closeElement: $('')
});

jCallout には init と initWithoutShow という 2 つの初期化メソッドがあることに注意してください。前者は初期化直後にバブルを表示しますが、後者は必要に応じて表示するコードを追加します。

コードをコピー コードは次のとおりです。

var $userNameInput = $("#hTbxUserName ");
$userNameInput.blur(function() {
if($userNameInput.val().length==0){
$userNameInput.jCallout('show');
}
});

パラメータ $closeElement はバブルの閉じるボタンを設定するためのものです。プラグインのソース コードを見ると、 が見つかります。

コードをコピー コードは次のとおりです:

$closeElement: $('(X)'),

$closeElement: $('') が設定されていない場合、次の表示が行われます。が表示され、(x) をクリックしてバブルを閉じます:

さらに、バブルには画像を表示することもできます。画像の HTML コードをメッセージ パラメーターに書き込むだけです。

コードをコピー コードは次のとおりです:

メッセージ: "「

」