ＩＥで動作確認もＦｉｒｅｆｏｘで動作しない

質問

皆さんお世話になってます。Javascript精通していません。
どうぞご指導ください。

ソースは下記になります。Firefox3.0で確認すると何も表示されません。IEだとうまく表示されました。原因を教えていただけますでしょうか？

HTML
<img src="./images/btn_estimate.gif" onclick="recalculate();"/>
[合計]<label id="price"><?= $price ?></label>

JavaScript
function recalculate() {
var total = 0;
document.getElementById("price").innerText = "";
if (document.form.design.checked == true) {
total = total + 10000;
}

total = total + document.form.pages.value * 5000;
if (document.form.form_func.checked == true) {
total = total + 3000;
}
document.getElementById("price").innerText = total;
}

回答No.4

yambejp · ベストアンサー

formにnameをつけるのはいいことないのでやめた方がよいです。
idでいきましょう。

総じてこんなかんじ。やはり問題はinnetText関係じゃないですかね

<script>
function recalculate() {
var f=document.getElementById("form_estimate");
var total = 0;
document.getElementById("price").innerHTML = "";
if (f.design.checked) total += 10000;
total += parseInt(f.pages.value) * 5000;
if (f.form_func.checked) total += 3000;
document.getElementById("price").innerHTML = total;
}
</script>

<form id="form_estimate">
<input type="checkbox" name="design" value="1" />
<input type="text" name="pages" size="3" maxlength="3" value="0" />
<input name="form_func" type="checkbox" value="1" />

<img src="./images/btn_estimate.gif" onclick="recalculate(this.parentNode);"/>
[合計]<label id="price"><?= $price ?></label>
</form>

お礼

完璧なソースをありがとうございました。
ここまで親切にしていただいて大変うれしいです。
おかげ様で、無事動作を確認いたしました。
ありがとうございました。

回答No.3

zxcv0000

何箇所かで使われている oElement.innerText は、InternetExplorer 依存だそうです。

参考URLの内容で試してみては？

参考URL：

http://www.tohoho-web.com/js/dom.htm#inner

お礼

おっしゃるとおり、
innerText　がFirefoxで使えない事が原因のようです。
参考URLありがとうございました。

回答No.2

SAYKA

No1の言う通り全部ソースがないからわからないけど
操作したいフォームが現れる前に実行しちゃってるんじゃない？

head内に書いてあるとbodyが現れる前に実行しちゃうから全部読み込まれたら実行されるように細工する必要があるよ

そうじゃなく？

補足

確かにhead部分に書いてあります。
ただIEだとうまく動作するんですが・・。
ちなみにどのように細工しておく必要がございますか？

回答No.1

fujillin

肝心のForm部分が提示されていないので、ほとんどわかりませんが・・・

document.form.～の指定方法で、formという識別名がタグのformとかぶっているのが、一因となっている可能性があります。
さらに、全体に、"price"の指定で行っているような、idを利用した指定方法にしておいたほうが良いと思われます。

補足

回答ありがとうございます。
確かに form部分name="form"となっていましたので"form"以外にしたのですが、かわらずでした。
ちなみにform部分は下記です。

<form name="form_estimate">
<input type="checkbox" name="design" value="1" />
<input type="text" name="pages" size="3" maxlength="3" value="0" />
<input name="form_func" type="checkbox" value="1" />

<img src="./images/btn_estimate.gif" onclick="recalculate();"/>
[合計]<label id="price"><?= $price ?></label>
</form>