.click(function { loadBox(url); });
ボタンの内から呼び出されている私の関数は次のとおりです。
var loadBox = function(url) {
var mask = $('#mask');
var box = $('#box');
$(mask).fadeTo(600, 0.8).promise().done(function() {
var winH = $(window).height();
var winW = $(window).width();
var boxH = winH * 0.6;
var boxW = winW * 0.8;
$(box).css({
width: boxW + 'px',
height: boxH + 'px',
top: ((winH - boxH) / 2) + 'px',
left: ((winW - boxW) / 2) + 'px'
});
$(box).load(url).promise().done(function () {
$(box).slideDown(300);
});
$(mask).click(function() {
if($(':animated').length)
return false;
$(this).hide();
$(box).hide();
});
});
}
#mask
/$(mask)
は<div>
、オーバーレイとして使用されている
コンテナです#box
。/は、 *.phpページをロードしている$(box)
別のコンテナです。ここで、urlは に類似したものです。<div>
$(box).load(url)...
/pages/player.php?match_id=1&player_id=15
これまでのところ、それは機能しているようですが、私を悩ませているのは、次の点だけです。
$(box).load(url).promise().done(function () {
$(box).slideDown(300);
});
さまざまなプレーヤーがいるテーブルがあります。プレーヤーの名前をクリックする#box
と、画面の中央にポップアップが表示され、player.php
そのプレーヤーに関する情報がロードされます。
しかし、#box
以前に他のプレーヤーの情報がロードされていた場合、ボックスは最初に ( $(box).slideDown(300);
) を表示し、その後その内容が変更されます。つまり、新しい情報がロードされる前に、他のプレーヤーの情報が約 0.5 秒間表示されます。
<function>.promise().done(...
私はそれまで待つと思っていました<function>
-私の場合.load(url)
は完了してから.done(function { });
スコープ内のすべてを実行しますか、それとも間違っていますか?
using を.load(url)
表示する前に通話が終了するまで待つ正しい方法は何ですか?$(box)
.slideDown()