私の質問は: 画面の右下隅に 10 秒間表示される div を作成するにはどうすればよいですか? この div は、php スクリプトによってトリガーされる ape-server インライン プッシュをトリガーします。PHPでデータをサルサーバーに投稿してから、jqueryを使用してx秒間表示されるdivを使用してこのデータをエコーしたいと思います。どうやって始めればいいのか、どうすればそれを機能させることができるのか、疑いの余地はありません!
1 に答える
あなたはここで2つの異なることについて話していると思います...
phpを使用してサーバー側の関数を使用するか(jQueryを使用してdivを表示/非表示にする)、またはjQueryを使用してAJAXリクエストを実行します。これらすべてを実行するときにページをリロードしたくないように思われるので、AJAXオプションを使用します。
AJAXでこれを行う方法の例は次のとおりです。
ページに表示するための応答を提供するデータを投稿できるサービスを実行する必要があります。これはphpでコーディングできます。
次に、jQueryを使用すると、次のようになります。
$(function(){
// use jQuery's .post() shorthand method to post your data to your php script
$.post('myService.php', function(data){
// do something with whatever is returned by your php function...
// in this instance, show a div containing the response
// (assuming the response is html)
$('#responseDiv').empty().append(data).fadeIn(500, function(){
// in this callback (which runs once the fadeIn animation is complete),
// we will tell #responseDiv to disappear after 10 seconds
setTimeout(function(){
$('#responseDiv').fadeOut(500);
}, 10000);
});
});
});
それがあなたの質問に答えるのに役立つことを願っています。
//編集:あなたのコメントに応えて、APEのドキュメントはこれを達成する方法を示しているようです-
var client = new APE.Client();
client.load();
client.core.join('testChannel');
client.request.send('foo', {ping: 'ho hey'});
client.onRaw('bar', function(raw, pipe) {
console.log('echo : ' + raw.data.echo);
console.log('Receiving : ' + raw.data.hello);
});
client.request.send()メソッドはサーバーにデータを送信し、client.onRaw()メソッドは、外観によって応答を処理する方法です。この場合、それはコンソールにログアウトしているだけですが、原則は健全です。このonRawは、外観から「バー」タイプのrawを探しています。
APEのドキュメントをよく読んでおくことをお勧めします。私は5分間読み回してここまで到達しましたが、実際にはAPEの専門家ではないため、調査にかなりの時間を費やさずにこれ以上先に進むことはできません。
//編集2
ここでの問題は、メッセージがdivに表示されてから消えるだけの場合、私の元の回答の一部が当てはまります。
$('#responseDiv').empty().append(data).fadeIn(500, function(){
// in this callback (which runs once the fadeIn animation is complete),
// we will tell #responseDiv to disappear after 10 seconds
setTimeout(function(){
$('#responseDiv').fadeOut(500);
}, 10000);
});
スクリプトのそのセクションは、データのコンテンツをdivに追加し、フェードインしてから、10秒後にフェードアウトします。次に行う必要があるのは、そのデータ変数の代わりにAPEからの応答を使用して並べ替えるだけです(と置き換えdata
てraw.data
ください)。
その場でdivを作成する必要がある場合は、次のようにすることができます。
// your css would need to set .response to be display: none
$('body').append('<div class="response">'+raw.data+'</div>');
$('.response').fadeIn(500, function(){
// in this callback (which runs once the fadeIn animation is complete),
// we will tell .response to disappear after 10 seconds
setTimeout(function(){
$('.response').fadeOut(500);
}, 10000);
});
それはあなたの問題に役立ちますか?