單選按鈕雖然可以以組的形式出現，有多個(gè)可供選擇的值，但是在同一個(gè)時(shí)間內只能夠選擇一個(gè)值，所以獲取單選按鈕值的方法與獲取文本框的值方法相同，都是直接通過(guò)name屬性快速讀取值。

下面示例為用戶(hù)提供一個(gè)單選操作，當用戶(hù)提交不同的選項后，后臺服務(wù)器將顯示不同風(fēng)格的圖片效果，如下圖所示。

【操作步驟】

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

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

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

第4步，把光標置于<form>標簽內，插入一個(gè)單選按鈕組和一個(gè)提交按鈕，定義單選按鈕組的name屬性值為sex，選項的value屬性值分別為men和women，設計完整的表單結構代碼如下：

<div data-role="content">    <form id="form1" name="form1" method="post" action="request.php">        <fieldset data-role="controlgroup" data-type="horizontal">            <legend>選擇外套風(fēng)格</legend>            <label>                <input name="sex" type="radio" value="men" checked />男款</label>            <label><input name="sex" type="radio" value="women" />女款</label>        </fieldset>        <input type="submit" value="提交數據" />    </form></div>

第5步，選擇【文件】|【另存為】命令，把index.html另存為request.php。在request.php文檔中，清除表單結構。然后切換到代碼視圖，編寫(xiě)PHP腳本代碼：

<?php    $interest = $_POST["sex"];    if($interest == "men"){        echo  '<h1>男款外套</h1>';        echo  '<img src="images/3.jpg" alt=""/>';    }    else{        echo  '<h1>女款外套</h1>'; echo  '<img src="images/2.jpg" alt=""/>';    }?>

第6步，在瀏覽器中預覽index.html頁(yè)面，然后在單選按鈕組中選擇一個(gè)選項，單擊【提交數據】按鈕提交表單，則在打開(kāi)的request.php頁(yè)面中立即顯示不同風(fēng)格的外套圖片。