アンカータグがクリックされたときにdiv要素をポップアップするスクリプトがあります
echo '<a href="javascript:void(0);" onclick="popup(\'yme-property-pop\'); loadproperties(\'open\', \''.$row['id'].'\');"><h2>' . $row['placename'] . '</h2></a>';
これはPHPスクリプトからエコーされ、FFおよびIE(9)で正常に機能しています。しかし、少なくともバージョンでは、chromeはそれを実行しません。18.0.1025.168 m
ポップアップ(分割); クリックするとイベントが発生しますが、関数が含まれているスクリプト内で関数呼び出しが完了しません。
var width_ratio = 0.4; // If width of the element is 80%, this should be 0.2 so that the element can be centered
function toggle(div_id) {
var el = document.getElementById(div_id);
if ( el.style.display == 'none' ) { el.style.display = 'block';}
else {el.style.display = 'none';}
}
function blanket_size(popUpDivVar) {
alert(popUpDivVar);
if (typeof window.innerWidth != 'undefined') {
viewportheight = window.innerHeight;
} else {
viewportheight = document.documentElement.clientHeight;
}
if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
blanket_height = viewportheight;
} else {
if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
blanket_height = document.body.parentNode.clientHeight;
} else {
blanket_height = document.body.parentNode.scrollHeight;
}
}
var blanket = document.getElementById('blanket');
blanket.style.height = blanket_height + 'px';
var popUpDiv = document.getElementById(popUpDivVar);
popUpDiv_height=0;
popUpDiv.style.top = popUpDiv_height + 'px';
}
function window_pos(popUpDivVar) {
if (typeof window.innerWidth != 'undefined') {
viewportwidth = window.innerHeight;
} else {
viewportwidth = document.documentElement.clientHeight;
}
if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
window_width = viewportwidth;
} else {
if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
window_width = document.body.parentNode.clientWidth;
} else {
window_width = document.body.parentNode.scrollWidth;
}
}
var popUpDiv = document.getElementById(popUpDivVar);
window_width=window_width/2;
window_width = window_width * width_ratio;
popUpDiv.style.left = window_width + 'px';
}
function popup(windowname) {
alert(windowname); // THIS WORKS
blanket_size(windowname);
window_pos(windowname);
toggle('blanket');
toggle(windowname);
}
そのスクリプトの最後の関数は、最初に呼び出される関数です。発射されたことを確認するためにアラートボックスを入れました。しかし、それが呼び出す次の関数(blanket_size)にアラートボックスを配置しましたが、関数の最初の行にアラートボックスがあったため、起動しませんでした。発火しませんでした。
理由がわからない。奇妙なことに、このようなものは他のブラウザでは機能しますが、Chromeでは機能しません。何か案は?
ありがとう!
編集:そして、popup()関数に渡されたパラメーター値('windowname'パラメーター)が有効である/値を持っていることも確認しました。HTMLドキュメントにあるDIVのIDが含まれており、動的に作成されることはありません。
編集2:わかりました。パラメータ値(windowname)を含むアラートボックスをpopup(windowname)関数に追加した場合にのみ、スクリプトを実行しました。しかし、そのボックスを削除すると、再び機能しなくなります。
編集3: デバッガーでエラーがまったく発生しませんでした。しかし今、私はさらに混乱しています。何度も試した結果、アラートボックスがランダムに機能しているようです。動作する場合と動作しない場合があります。
最終編集 ロジックをjQueryに変更しました。これはずっと前にやるべきだった!
// Open property
$(".property-open-link", ".yme-propertyitem").live('click', function() {
$("#yme-property-pop").css({'display': 'block', 'z-index': '9999' });
$("#blanket").css({'display': 'block', 'height', getBlanketHeight(), 'z-index': '1000' });
loadproperties('open', $(this).closest(".yme-propertyitem").attr("id"));
});
// Close property button
$("#yme-property-close").live('click', function() {
$("#yme-property-pop").css('display', 'none');
$("#blanket").css('display', 'none');
});