Nov 18, 2004

XHTML 1.0 Strictなコメントフォーム

XHTML 1.0 Strictでは、form要素にname属性が使えません。そのname属性の代わりにid属性を使うことにしたとすると、標準のIndividual Archive Templateなどに含まれている以下のJavascriptのコードが使えなくなります。

<script type="text/javascript" language="javascript">
<!--
if (document.comments_form.email != undefined)
    document.comments_form.email.value = getCookie("mtcmtmail");
if (document.comments_form.author != undefined)
    document.comments_form.author.value = getCookie("mtcmtauth");
if (document.comments_form.url != undefined)
    document.comments_form.url.value = getCookie("mtcmthome");
if (getCookie("mtcmtauth") || getCookie("mtcmthome")) {
    document.comments_form.bakecookie[0].checked = true;
} else {
    document.comments_form.bakecookie[1].checked = true;
}
//-->
</script>

…使えなくなるわけですが、どうも勘違いしてまたgetElementByIdのオンパレードにする人(c.f., Ogawa::Buzz: Javascriptでの表示・非表示切り替え)が出てきそうなので、大流行する前に一応書いておきます。

form要素のname属性をなくすとdocument.comments_formでは参照できなくなりますが、id属性にcomments_formを指定してあればdocument.forms['comments_form']で参照できます。また、当然のことですが、input要素のname要素は廃止されておらず、nameの値を使ってformオブジェクトから参照することができます。つまり、input要素はdocument.forms['comments_form'].emailなどで参照することができます。

したがって上記のコードは以下のように修正するだけで済みます。

<script type="text/javascript">
var comments_form = document.forms['comments_form'];
if (comments_form.email != undefined)
    comments_form.email.value = getCookie("mtcmtmail");
if (comments_form.author != undefined)
    comments_form.author.value = getCookie("mtcmtauth");
if (comments_form.url != undefined)
    comments_form.url.value = getCookie("mtcmthome");
if (getCookie("mtcmtauth") || getCookie("mtcmthome")) {
    comments_form.bakecookie[0].checked = true;
} else {
    comments_form.bakecookie[1].checked = true;
}
</script>

ちなみに私自身はこのあたりはcomments.jsに分離してIndividual Entry Archiveの該当箇所には以下のようにだけ書いています。

if (document.forms['comments_form'])
    fillCommentFieldsByCookie(document.forms['comments_form']);

About Me

My Photo

つくばで働く研究者

Total Pageviews

Amazon

Copyright 2012 Ogawa::Buzz | Powered by Blogger
Design by Web2feel | Blogger Template by NewBloggerThemes.com