- PR -

JavaScriptのLABELの扱いは？

1
投稿者投稿内容
原
会議室デビュー日: 2004/08/02
投稿数: 9
投稿日時: 2004-08-30 15:55
画面で出力専用の項目にLABALを使い、JavaScriptでLABELのinnerTextに
表示する値を設定しているのですが、ブラウザがIE6の場合は
表示されるのですが、FireFox(Mozilla)の場合に
エラー: not defined
になります。

何がわるいのでしょうか？
ソースです。
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="cache-control" CONTENT="no-cache">
<META HTTP-EQUIV="expires" CONTENT="0">
<TITLE></TITLE>
<SCRIPT LANGUAGE="JavaScript">
function fncA(){
if(document.f.p.value=="001"){
l.innerText = "北海道札幌市北区";
}else{
l.innerText = "不明";
}
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="f">
<TABLE BORDER=1>
<TR>
<TH>郵便番号</TH>
<TD><input size=3 maxlength=3 name="p" value="001"></TD>
<TD WIDTH=150><LABEL ID=l></LABEL><br></TD>
<TD><INPUT TYPE="button" VALUE="検索" onClick="fncA()"></TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
taro
ぬし
会議室デビュー日: 2003/10/20
投稿数: 316
投稿日時: 2004-08-30 16:30
LABELタグというよりinnerTextプロパティの話だと思うのですが、
innerTextプロパティを含むDHTML（DynamicHTML）という仕様は
IEが独自に拡張したものなので、IE以外のブラウザは対応していないのです。
http://e-words.jp/w/DHTML.html
今後対応されるかもしれませんがちょっと分かりません。
# ご存知の方はフォローお願いします。
いっきゅう
大ベテラン
会議室デビュー日: 2004/04/04
投稿数: 153
お住まい・勤務地: 兵庫
投稿日時: 2004-08-30 16:49
２点ミスありますね。
１つめはIDのアクセス方法（エラー: not defined）で
document.getElementById("l")として下さい。
IEだといろんな方法でかつ直接IDのオブジェクトを取得できますが
mozillaや他のはちゃんとお約束を調べてその通りしましょう。
２つめはinnerTextは未対応なのでinnerHTMLを使えば解決しますね。
以下、その結果です。
コード:
function fncA(){ 
    if(document.f.p.value=="001"){ 
        document.getElementById("l").innerHTML = "北海道札幌市北区"; 
    }else{ 
        document.getElementById("l").innerHTML = "不明"; 
    } 
}
原
会議室デビュー日: 2004/08/02
投稿数: 9
投稿日時: 2004-08-30 17:05
LABELのJavScriptの使用方法が探せなくてお手上げでした。

どうもありがとうございました。

いっきゅう
大ベテラン
会議室デビュー日: 2004/04/04
投稿数: 153
お住まい・勤務地: 兵庫
投稿日時: 2004-08-30 17:12
> LABELのJavScriptの使用方法が探せなくてお手上げでした。

taroさんもおっしゃっていますがこれはLABELの問題じゃありません。

例えばLABELの部分を
<LABEL ID=l></LABEL>から
<P ID=l></P>にしてもこの場合は問題ないはずです。

LABELは、フォームの中で、フォーム部品とラベルを関係付けるために用います。<LABEL>〜</LABEL>で囲まれた部分が、FOR属性で指定したIDを持つ部品のラベルになります。

ラベルを明示することにより、ブラウザでラベルをクリックした時や、ラベルのアクセスキーを押した時に、その部品をクリックしたのと同じ動作をさせることができるようになります。

以上、ちょっと補足。
永井和彦
ぬし
会議室デビュー日: 2002/07/03
投稿数: 276
お住まい・勤務地: 東京都
投稿日時: 2004-08-30 17:51
引用:

このようような用途で使うタグとしては何を使うのが適切なのでしょうか？
（Tablle内で使用して、JavaScriptで設定・参照を行います。）


文書構造上の意味付けが明確でない(/使いたいDTDに適切なタグが定義されていない)場合のライン要素としてSPANがあります。今回のケースでは、これが適切だと思います。

引用:

<P ID=l>を試してしたところ、高さが変わってしまいました。


Pはデフォルトでブロック要素指定ですから……。

あと、余談ですが……見た目で考えるのは止めた方がいいと思います。
原
会議室デビュー日: 2004/08/02
投稿数: 9
投稿日時: 2004-08-30 18:04
そうですね、<SPAN>を使うべきでした。

皆様、ありがとうございました。

[ メッセージ編集済み 編集者: 原 編集日時 2004-08-30 18:15 ]
1

スキルアップ／キャリアアップ（JOB@IT）