1. 程式人生 > >淺談form標籤與table標籤

淺談form標籤與table標籤

  • a標籤與form標籤都是跳轉頁面。區別在與a發起的get請求。form發起的是get或post請求.
  • 如果form表單裡沒有提交按鈕,就沒法提交表單。
  • form預設是get請求。get是獲取內容。post是上傳內容。post是想把我的東西提交至伺服器。 get會預設把輸入框內容設為查詢引數,提交時出現在位址列。

  • post請求會出現在第四部分。get請求沒有第四部分。

  • form標籤的target和a標籤的target是一樣的
<form action="http://www.baidu.com" method="post">
    <input type="text" name="username"
> <input type="password" name="password"> <input type="submit"> </form>
  • 可以得到兩個username和password的欄位。
  • http不靠譜,雖然提交的時候密碼看不到,只要沒使用https,就會順著網線明文傳到伺服器,只要有人做了監聽就能拿到你的password.
  • 你提交的賬號密碼會出現在第四部分裡,但GET請求是不會有第四部分的,POST若想有查詢引數,可以直接寫在action裡.
  • <form>裡如果沒有而有<button>,則<button>
    會自動升級為submit,若寫成這樣
    <button type="button">button</button>則不會成submit,一個form裡必須要有一個submit才能提交
    <button >button</button>這樣就可以提交
  • input標籤的type屬性有很多值。
    <label>可以直接包在input外面

    checkbox屬性

<label><input type="checkbox" name="apple" value="yes">蘋果</label>
<label
>
<input type="checkbox" name="banana" value="yes">香蕉</label>

radio屬性

<label><input type="radio" name="sexual"></label>
<label><input type="radio" name="sexual"></label>

多個radio的name要相同

select標籤

<select name="group" multiple>
    <option value="">-</option>
    <option value="1">第一組</option>
    <option value="2">第二組</option>
    <option value="3" disabled>第三組</option>
    <option value="4" selected>第四組</option>
</select>
<select>

第一個-代表啥也沒選中。disabled屬性意味著不能被選中,selected意思是預設選中的,multiple意思是可以同時選中幾項。

textarea標籤

若想讓使用者輸入一大段文字則用這
<textarea style="resize: none; width: 200px; height: 100px;" name="hobbies"></textarea>

resize若不設定為none,則使用者可以隨意更改輸入框的大小


table標籤
<table border="1">
    <colgroup>
        <col width="100">
        <col bgcolor="red" width="200">
        <col width="100">
        <col width="100">
    </colgroup>
    <thead>
        <tr>
            <th>專案</th><th>姓名</th><th>班級</th><th>成績</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th></th><td>張三</td><td>1</td><td>22</td>
        </tr>
        <tr>
            <th></th><td>李四</td><td>2</td><td>12</td>
        </tr>
        <tr>
            <th>平均分</th><td></td><td></td><td>17</td>
        </tr>
    </tbody>
    <tfoot>
    <tr>
        <th>總分</th><td></td><td></td><td>34</td>
    </tr>
    </tfoot>
</table>
<table>

<thead> <tbody> <tfoot>不寫瀏覽器也不會報錯,而會自動全部加入到tbody裡