1. ホーム
  2. Web制作
  3. HTML/Xhtml

html のリストボックス、テキストフィールド、ファイルフィールドのコード例

2022-01-21 09:20:38

ドロップダウン・ボックス、テキスト・フィールド、ファイル・フィールド

上記はデモ効果で、下記はコードです。

<form method="get" action="result.html">
<! --input:Input box tag, default is text, text box
	name: a name for the input box, used to submit data
	maxlength="8":The maximum number of characters that can be entered in the text box is 8
	size="30":the length of the text box when 30px
-->
	<p>username:<input type="text" name="username" value="textbox initial value"
	maxlength="8" size="30"/></p>
<! -- password box input type="password", password box input characters will be displayed as small dots -- >
	<p> Password: <input type="password" name="pwd"/></p>
<! --radio:radio
	value:initial value, the radio box must be filled
	name:group, otherwise the single selection will be wrong
	input tag needs to be closed
-->
	<p>gender.
	<input type="radio" value="boy" name="sex"/>male
	<input type="radio" value="girl" name="sex"/>female
	</p>
<! --checkbox:Multi-select box
	value:The value corresponding to the option
	checked:Checked by default, used in input tags
-->
	<p>hobby:
	<input type="checkbox" value="sleep" name="hobby"/> sleep
	<input type="checkbox" value="code" name="hobby"/> knock code
	<input type="checkbox" value="chat" name="hobby"/>chat
	<input type="checkbox" value="game" name="hobby" checked/>game
	</p>
<! --button:Normal button
	type="image":image button, replaces the button's style with an image
	submit: submit button, submit the value of value to the value corresponding to name
	reset reset button, reset all input boxes
	value:The value of the value is the name of the button
-->
	<p> button:
	<input type="button" name="btn1" value="Click to make long"/>
	<input type="image" src="1.jpg"/>
	</p>
<! --select:drop-down-box tag
	option:dropdown option label
	selected:Selected by default, used in dropdown box labels
-->
	<p> country.
	<select name="country">
	<option value="cn" selected>China</option>
	<option value="usa">United States</option>
	<option value="uk">United Kingdom</option>
	<option value="jp">Japan</option>
	</select>
	</p>
<! --textarea:Text field
	cols:the number of columns in the text field
	rows:the number of rows in the text field
-->
	<p>Feedback.
	<textarea name="textarea" cols="50" rows="10"> Text content </textarea>
	</p>
<! --type="file":file field
	Note 1:The file field is used to select the file and also requires an upload button
	Note 2:There are two names here, the upload file is submitted to the files corresponding to the file domain
		and not the upload corresponding to the button.
		In other words, after selecting the file value=the file to be uploaded, after uploading files=the file to be uploaded
-->
	<p> file field.
	<input type="file" name="files">
	<input type="button" value="upload" name="upload">
	</p>
	
	<p>
	<input type="submit" value="submit"/>
	<input type="reset" value="reset"/>
	</p>
</form>

この記事は、htmlのリストボックス、テキストフィールド、ファイルフィールドのサンプルコードは、このに導入され、より関連するhtmlのリストボックスの内容は、スクリプトの家の前の記事を検索するか、次の関連記事を閲覧を続けてください、私はあなたが将来的に多くのスクリプトハウスをサポートして願っています!.