html - フォーム要素がフォームの外に表示される

Question

次のようなフォームをレンダリングします。

<form action='/search' method='get' style='display: none'>
  <input name='q' type='search' />
  <input type='submit' value='Search' />
</form>

ページ ソースではこの部分はそのままのように見えますが、Web Inspector と Firebug の両方で DOM ツリーに次のように表示されます。

<form action='/search' method='get' style='display: none'></form>
<input name='q' type='search' />
<input type='submit' value='Search' />

したがって、display: noneステートメントにもかかわらず入力が表示され、フォームの送信も機能しません。

なぜそうなのか、何かアイデアはありますか？謎はさらに深く、このフォームはサイトの 2 つのページでレンダリングされ、もう一方のページでは期待どおりに表示されます。

Answer 1

表示が none に設定されていると、フォームが表示されないようにする必要があります。そして、あなたのページの1つでさえも機能しているので、コードについて確信があります. 他のページでコードを確認する必要があります。作業フォームのコードを貼り付けたと思います:)

Answer 2

div を作成し、display:none を適用します。form要素にdisplay noneを適用する代わりに