タグ

htmlとformに関するnabinnoのブックマーク (11)

  • React useRef を理解する| yukinaka[log]

  • 二章第十二回 フォームの操作 — JavaScript初級者から中級者になろう — uhyohyo.net

    二章第十二回 フォームの操作このページの最終更新日:2017年9月29日 フォームについての説明は、基礎第六回にもありましたね。今回はよりDOM的な観点からフォームについて振り返ります。 HTMLFormElementform要素のHTMLElementは、HTMLFormElementと呼ばれます。 このform要素ですが、今までと同様にgetElementByIdなどで取得することも可能ですが、実は専用のものもあります。 それは、documentが持つformsというプロパティで、これはHTMLCollectionです。例えば、 <!doctype html> <html> <head> <title>test</title> </head> <body> <form id="form1" action="?"> </form> <script type="text/javascrip

    二章第十二回 フォームの操作 — JavaScript初級者から中級者になろう — uhyohyo.net
  • HTMLInputElement - Web API | MDN

  • フォームの自動補完を無効にするには - ウェブセキュリティ | MDN

    この記事では、フォーム入力欄の自動補完をウェブサイト側から無効にする方法を説明します。 既定では、ウェブサイト上の <input> 欄を通じてユーザーが送信した情報はブラウザーによって記憶されます。これよってブラウザーは、自動補完 (入力を受けた入力欄の補完候補をユーザーに提示する機能) や、オートフィル (読み込まれた入力欄をあらかじめブラウザーが補完する機能) を実現しています。 これらの機能は通常は既定で有効ですが、ユーザーのプライバシーにかかわる可能性があるため、ブラウザーは無効にすることができます。しかしながら、フォームで送信される情報の中には将来利用する価値のないもの (ワンタイムパスワードなど) や、機密情報 (公的な識別番号やクレジットカード番号など) が含まれることがあります。ブラウザーの自動補完機能が有効であっても、ウェブサイトの作者としては、そのような入力欄の値をブラ

    フォームの自動補完を無効にするには - ウェブセキュリティ | MDN
  • maxlengthで半角文字数で制限するには? | Webサイト開発

    この結果を見ると、docomoだけがバイト数として扱っているようだ。SoftBank C型・P型の場合もバイト数として扱っていた記憶があるけど、C型とP型は3月末でサービスが終了したから該当しなくなった。 ちなみにバイト数というのは、シフトJIS換算のバイト長のこと。HTMLのキャラクタエンコーディングをUTF-8にしても、結局はシフトJISでの長さとなる。 影響範囲と対応方法 maxlength属性の仕様の違いが最も影響するのは、DBアクセスがからんできたとき。テーブル定義にもよるけど、フォームで入力したテキストをそのままDBに入れてしまうと、DBアクセスでエラーになる可能性がある。 たとえば、Oracleでフィールド定義が VARCHAR2(20) のカラムに日語を格納する場合、データベースキャラセットがシフトJISなら全角10文字まで入る。PCサイトが前提ならmaxlength=”

    maxlengthで半角文字数で制限するには? | Webサイト開発
  • input 要素の disabled 属性と readonly 属性の違い

    (X)HTML の disabled 属性と readonly 属性の違いについて、どちらの属性もユーザーが値を変更できないのは同じですが、振る舞いが異なります。 <input name="a" type="text" value="hoge" disabled="disabled" /> <input name="b" type="text" value="hoge" readonly="readonly" /> 最近、2つの属性の違いが気になって調べたので、以下、HTML 4.01仕様書(和訳)からの引用抜粋と、それぞれの違いを表にまとめました。文中の「選択不能指定」が disabled、「読み出し専用指定」がreadonly です。原文へのリンクも掲載しています。 17.12 選択不能指定と読み出し専用指定からの引用[原文] ユーザによる入力が望ましくなかったり不適切だったりする場合

  • 都道府県選択するやつ。

    メモ。 誰かの役にも立つかもしれないしってことで、いつも過去の案件のソースとか探してペタペタしてるけど、何処で使ったのか忘れたりするのでここに貼っておこう。 - コメントにて使用条件を書いてほしいとの事だったので念の為追記しておきます。 特別記載が無いエントリー以外は、どう使うのも自由です。 自分のブログにそのままソース掲載してもらっても、仕事で使ってもいいですし、あらゆる用途に対して自由に使ってください。 もちろん、改変・配布とかも自由です。 ただ、ウチで公開しているソースやサンプルに対して何らかの問題が生じても責任は負いません。各自の責任でご利用ください。 大体こんな感じです。 select要素でマークアップ済みの都道府県のやつ <select name="都道府県"> <option value="">都道府県をお選びください。</option> <optgroup label="北

    都道府県選択するやつ。
  • JavaScript/フォーム/自動的にフォーカスを合わせる - TAG index

    <html> <head> <title>TAG index Webサイト</title> </head> <body onLoad="document.form1.field1.focus()"> <form action="#" name="form1"> <p>お名前:<input type="text" name="field1" size="25"></p> </form> </body> </html> フォーカスを合わせたい入力欄を、以下の方法で設定してください。 document.フォーム名.フィールド名.focus() フォーム名 … formタグの name="" で指定した名前(上記の例では form1) フィールド名 … フィールドの name="" で指定した名前(上記の例では field1) ページを表示したときに自動的にフォーカスを合わせるので、bodyタグに

    JavaScript/フォーム/自動的にフォーカスを合わせる - TAG index
  • 改行の研究

    「改行に注意!」でも改行に関して触れる機会がありましたが、ここでは改行を別な観点から考えてみます。 下のテキストアリアに2行の文章が入っています。「文字数」ボタンを押してみて下さい。 Windows なら、「22字」という答えが表示されるはずです。 入っている文字は20しかないのに、22になるのは、改行コード分が含まれるからです。しかし、なぜ22なのでしょう? その理由は、Windows などでは CR(carriage return「復帰」)と LF(line feed「行送り」)という2つの制御コードの組み合わせで改行を表しているからです。 それぞれ1バイトで計2バイトとなります。「復帰」というのは元々、行頭に戻ることを意味し、「行送り」は次の行に移ることを意味していました。 つまり或る行の終わりで行頭に帰り、次の行の頭に移るということです。 しかし現在のパソコンでは、この区別は必ずし

  • テキストエリア <TEXTAREA> - HTMLタグリファレンス/Tips

    <TEXTAREA>タグについて 複数行のテキスト入力領域を作成します。<TEXTAREA>〜</TEXTAREA>内に文章を記入しておくと、あらかじめ入力された形で表示されます。 readonly属性を使って、プログラムのソースなどを表示するのにもよく使われます。

  • 基本的なフォーム -- ごく簡単なHTMLの説明

    この例をもとに、HTMLのフォームを構成する要素を順番に説明していきます。この例のHTML全体は、章の最後で改めて紹介します。 フォームの基枠組み データを送信するためには「何を」「どこに」「どうやって」送るかを示さなければなりません。フォームはこのための手段を提供します。 HTMLのフォームは、データを入力するための手段(コントロールと呼びます)と、それに関するラベルや説明から構成されるひとまとまりのセクションです。「何を」送信するかを示すためにこのセクションの範囲を明示し、「どこに」「どうやって」送信するかを設定します。この枠組みを提供するのがform要素です。 form要素の構造 form要素タイプは2つの主要な属性を持ちます。ひとつは「どこに」、つまりデータを受け取るプログラムを指定するaction属性、もうひとつが「どうやって」、つまりデータの送信方法を指定するmethod属

  • 1