だから私はこのコードを持っています。これはphpファイルの出力です(したがって、3つの評価などのようなものです)。
Firefox では問題なく動作しますが、Chrome と IE はオブザーバーが存在しないかのように動作します。
また、#ratingwrapper の onmouseout 関数は、クロムでは「未定義」と見なされます。なぜこれら 2 つのブラウザーが JS を完全に無視しているのに、firefox はすべてを認識しているのかは気が遠くなるようなものです。
単純なアラートを呼び出しても、すべてを試してみましたが、ie と chrome では何も機能しませんでした。オブザーバーを削除して #ratingwrapper div ですべてを実行しようとしましたが、クロムではすべての関数が「未定義」になっています。
私はプロトタイプを使用しています。プロトタイプを使用する他のスクリプトがページで動作しているため、ヘッダー js 宣言はすべて適切です。競合などはありません。この説明のつかないバグで立ち往生しています。
<div class="ratings">
<div class="rating-box" id="ratingbox">
<div class="rating" id="ratingboxfill" style="width:100%"></div>
</div>
<div id="ratingwrapper" onmouseout="revertProductRating()"></div>
<br /><br />
<div id="curpos"></div>
<div id="cpos"></div>
<span class="amount">3 ratings</span>
<input id="newRating" type="hidden" value="0" />
</div>
<script type="text/javascript">
function setNewProductRating(e) {
var ratingx = Event.pointerX(e);
var ratingy = Event.pointerY(e);
var containerLeft = Position.page($('ratingbox'))[0];
var containerTop = Position.page($('ratingbox'))[1];
var hpos = ratingx - containerLeft;
var vpos = ratingy - containerTop;
$("cpos").update(hpos+","+vpos);
if (hpos <= 9) {
revertProductRating(10)
$("newRating").value=1;
} else if(hpos <19) {
revertProductRating(20)
$("newRating").value=2;
} else if(hpos <28) {
revertProductRating(30)
$("newRating").value=3;
} else if(hpos <38) {
revertProductRating(40)
$("newRating").value=4;
} else if (hpos < 47) {
revertProductRating(50)
$("newRating").value=5;
} else if (hpos < 57) {
revertProductRating(60)
$("newRating").value=6;
} else if (hpos < 66) {
revertProductRating(70)
$("newRating").value=7;
} else if (hpos < 76) {
revertProductRating(80)
$("newRating").value=8;
} else if (hpos < 85) {
revertProductRating(90)
$("newRating").value=9;
} else if (hpos < 96) {
revertProductRating(100)
$("newRating").value=10;
} else {
revertProductRating()
}
}
function revertProductRating(force=0) {
if (force == 0) {
//document.getElementById("ratingboxfill").style.width = "100%";
$("curpos").update("force=0");
$("ratingboxfill").setStyle({
width: '100%'
});
} else {
//document.getElementById("ratingboxfill").style.width = force+"%";
$("curpos").update("force="+force);
$("ratingboxfill").setStyle({
width: force+'%'
});
}
}
function sendProductRating()
{
value = $("newRating").getValue();
window.location = 'http://x.dev/y/' + 'ratingValue/' + value;
}
$('ratingwrapper').observe('mousemove', setNewProductRating);
$('ratingwrapper').observe('click', sendProductRating);
</script>