2011-01-11 6 views
1

アラートボックスを使用せずにjqueryエラーメッセージを表示するにはどうすればよいですか?画面上に赤色で表示するには、1行のエラーメッセージが必要です。jqueryエラーメッセージ

+0

メッセージをdivに配置し、必要な場所に配置できます。 CSSとDOMは可能にします。 –

答えて

2

ちょうどそれが...

function error(msg) { 

    var msgBox = $('#msg-box'); 

    if (msgBox.length === 0) { 
     msgBox = $('<div />', { 'id': 'msg-box'}).hide().prependTo('body'); 
    } 

    msgBox.html(msg).fadeIn(500); 

} 

その後

#msg-box { 
    background: red; 
    padding: 1em; 
} 

See it on jsFiddleいくつかのCSSを追加し機能させます。

+0

私はあなたにフィドルの場合のみ+1を与えますが、ネイティブの 'alert'関数を置き換えることを提案しますか?ああ... –

+0

@Felix Kling申し訳ありませんが、それはOPのようなものでした(私は*推奨されていない*警告を残していた)です。私はその部分を削除し、まだ+1を得ることを願っています:) – alex

+0

Mmhは私に考えさせました........ ok :) –

0

jQuery UIのdialog component(やはりsee here)を試してみてください。あるいは、残りのコンテンツと並んでpまたはdiv要素をインラインで作成し、その中にメッセージを入れて、それを取り除くためのボタンを提供することもできます(または、数秒後に自動的に非表示にすることもできます)。

0

エラーを表示する場所に置きます。

<div id='errorDiv'></div> 

エラーメッセージを内部に入れます。

0

このような何か:

$("<p>error message</p>").css("color", "red").appendTo($("body")); 

ます。また、HTMLでの空のノード(DIV)を置くことができ、ID "ERROR_MSG" と言って、それにメッセージを追加するためにこれを使用します。

$("#error_msg").html("error message"); 
1
例えば

function jAlert(text) { 
    var jAl = $('#jAlert'); 
    jAl = jAl.length ? jAl : $('<div>',{'id':'jAlert'}).css({ 
     'padding': '10px', 
     'border': '1px solid black', 
     'position': 'absolute', 
     'color': 'red' 
    }).click(function() { 
     $(this).hide(); 
    }).appendTo('body').hide(); 


    jAl.html(text).show(); 
} 

fiddle

chromeまたはfirebugでconsole.log()を使用できるデバッグ情報のみを表示したい場合

+0

ルールをCSSスタイルシートに配置することをお勧めします。そうしないと、プレゼンテーションとビヘイビアを必要としない場所で混在させることになります。 – alex

+0

はい、私はちょうどそのような簡単な例のためにそれをやったが、あなたはもちろん正しい。 – Andy

関連する問題