獲取列表框的值

  • 2020-08-18 10:12:44
  • 閱讀次數:次
  • 作者:盈嵐科技小編
  • 來(lái)源:http://amzcoolest.com

在網(wǎng)站建設中獲取下拉菜單的值與獲取文本框的值完全相同,由于列表框允許多選,所以在獲取列表框的值時(shí),可以模仿復選框組的方法獲取用戶(hù)提交的值。下面示例演示如何快速獲取用戶(hù)提交的列表框值,并以按鈕的形式顯示出來(lái),效果如下圖所示。

98d0852b8399d7bdee522e90458542fe.jpg

【操作步驟】

第1步,打開(kāi)模板頁(yè)(orig.html),另存為in-dex.html。

第2步,把光標置于<div class="container">標簽中,然后選擇【插入】|【表單】|【表單】命令,在當前光標位置插入一個(gè)表單框。

第3步,選中表單框<form>標簽,在【屬性】面板中設置action和metho屬性值,定義請求文件為同目錄下的request.php,請求的方式為POST。

第4步,把光標置于<form>標簽內,插入一個(gè)列表框和一個(gè)提交按鈕,定義列表框的name屬性值為interest[],定義列表選項的屬性值分別為“體育”、“音樂(lè )”、“計算機”和“英語(yǔ)”;定義提交按鈕的value屬性值為“提交數據”,如圖17.24所示。

惹.jpg

第5步,切換到代碼視圖,可以看到設計完整的表單結構代碼如下:

<div class="container">    <form id="form1" name="form1" method="post" action="request.php">        <label for="interest">興趣</label>        <select name="interest[]" id="interest" size="4" multiple class="form-control">            <option value="體育">體育</option>            <option value="音樂(lè )">音樂(lè )</option>            <option value="計算機">計算機</option>            <option value="英語(yǔ)">英語(yǔ)</option>        </select><br>        <input type="submit" value="提交數據" class="btn btn-success btn-block" />    </form></div>

第6步,選擇【文件】|【另存為】命令,把index.html另存為request.php。在request.php文檔中,清除表單結構。然后在<div class="con-tainer">標簽中輸入文本“您的興趣是:”,在【屬性】面板中設置“格式”為三級標題。

第7步,按Enter鍵另起一行,切換到代碼視圖,編寫(xiě)PHP腳本,使用$_POST["interest"]讀取用戶(hù)選擇的值,結合for循環(huán)語(yǔ)句就可以輸出所有被選中的選項值,完成后的腳本如下:

<div class="btn-group-vertical">    <?php    $interest = $_POST["interest"];    if($interest != nul){                            //判斷列表框的返回值是否為空        for($i=0;$i<count($interest);$i++)           //通過(guò)for循環(huán)輸出選中的列表框的值            echo  '<div class="btn btn-primary">'.$interest[$i].'</div>';    }?></div>

第8步,在瀏覽器中預覽index.html頁(yè)面,然后在列表框中選中多個(gè)選項,單擊【提交數據】按鈕提交表單,則在打開(kāi)的request.php頁(yè)面中立即顯示所有被選擇的列表項目。


當前文章標題:獲取列表框的值

當前URL:http://amzcoolest.com/news/wzzz/3262.html

上一篇:獲取下拉菜單的值

下一篇:獲取密碼域和隱藏域的值

網(wǎng)站建設、抖音推廣、頭條推廣、微信朋友圈推廣、快手推廣專(zhuān)線(xiàn):15368242187(微信同號)
亚洲精品无码mv在线|新国产精品视频福利免费|日韩高清在线观看不卡一区二区|一本久久a久久精品免费不|亚洲私人无码内射免费观看