How to use html option tag and check which option is selected?

Question 1

Well! as far as i understood your question. If you want to redirect your client on option clicking then this might be helpfull

   <select id="opts" onchange="GotoPage()">
        <option value="0">SELECT</option>
        <option value="index.html">Home</option>
        <option value="page.html">Page</option>
        <option value="setting.html">Setting</option>
        <option value="go.html">Go</option>
    </select>

In Script as:

<script type="text/javascript">
function GotoPage()
{
   var loc = document.getElementById('opts').value;
   if(loc!="0")
   window.location = loc;
}
</script>

Question 2

Add name="scroll" to select tag

take the value of options by var val = $('select[name="scroll"] option:selected').text();

<body>
    <select id="scroll" name="scroll" style="height:50px; width:150px;" >
    <optgroup label="Home">
    <option value="0" >Home</option>
    </optgroup>
    <optgroup label="Page" >
    <option value="1" >Page</option>
    </optgroup>
    <optgroup label="Other" >
    <option value="2" >Settings</option>
    </optgroup>
    </select>
    <button type="button">Go</button>
    </body>

js

<script type="text/javascript">
    $('document').ready(function(){
                        $('#button').click(function(){
                                var val = $('select[name="scroll"] option:selected').text();
                                                       if(val == 1){
                                                       window.location.replace("/passbook.html");
                                                       }else if(val == 2){
                                                       window.location.replace("/settings.html");
                                                       }
                                                       });
                                           });
                        });
    </script>