AMPエラー HTML タグに必須属性がありません。- formとjavascript

スポンサーリンク

ブログ記事の中にフォームを入れていたら、ampエラーになりました。

カスタムHTMLを使うとよくAMPエラーになりますね。

足りなかったのは、formタグのtarget属性でした。formタグの説明では特に見かけなかったんですが、必須属性なんですね。

今回のコードでは、javascriptの関数を動作させるためのボタンを配置するためにフォームを作りました。

特にデータをサーバーに送るものでもなかったので、formのプロパティを指定していなかったのが、よくなかったようです。

こちらが参考リンクです。

フォームはサーバーへのデータ送信のためのHTML要素なので、method, action, target を指定する必要があるようです。

うーん。ただ、スクリプトの起動ボタンとしては大げさだったかな。

シンプルにリンクで解決してみます。

<a href="javascript:random();">ランダムな暗証番号を作る</a><br />

このようにhref属性でjavascriptを呼び出すことができます。

<span id="ransuu">表示場所</span>

<script type="text/javascript">
function random() {
var result = "";
for (i=0; i<5; i++) {
var num = Math.floor( Math.random() * 10000) ;
result += ("0000"+num).slice(-4) + "    "; 
}
document.getElementById("ransuu").innerHTML = result; 

}
</script>

タグ「a」の属性「href」の URL プロトコル「javascript」が無効です。

しかし、これもだめ……

そもそもAMPページでは独自のjavascriptと使えないんですね。

高速化の主な仕組みの1つに、AMPに対応したWebページのHTMLを事前にGoogleでキャッシュ(Google AMP Cache)しておくところにあります。

(中略)

また、AMP対応のJavaScript以外を許容しない、外部リソースのサイズをあらかじめ固定しておくなど、様々な制約を設けて読み込みや描画の負荷を減らすことも高速化・データ量削減に繋がっています。

https://bulan.co/swings/amp-builds/

javascriptを利用するページはとりあえずAMPページを生成しないで、様子を見てみます。

Cocoonテーマでは文書オプションのチェックで変更できるので、かんたんですね。

ということで解決しました。

こちらもどうぞ

タイトルとURLをコピーしました