function getSelectionText() {

    var text = "";

    if (window.getSelection) {

        text = window.getSelection().toString();

    } else if (document.selection && document.selection.type != "Control") {

        text = document.selection.createRange().text;

    }

    return text;

}

<select id="ddlViewBy">

  <option value="1">test1</option>

  <option value="2" selected="selected">test2</option>

  <option value="3">test3</option>

</select>

Running this code:

​

var e = document.getElementById("ddlViewBy");

var strUser = e.value;

Would make strUser be 2. If what you actually want is test2, then do this:

​

var e = document.getElementById("ddlViewBy");

var strUser = e.options[e.selectedIndex].text;

<select id="box1" onChange="myNewFunction(this);">

  <option value="98">dog</option>

  <option value="7122">cat</option>

  <option value="142">bird</option>

</select>

<script>

  function myNewFunction(sel) {

  alert(sel.options[sel.selectedIndex].text);

}

</script>

// highlight text in an input element

element.select();

​

// highlight a portion of an element

// element.setSelectionRange(start, end, ?direction)

// start, end - start and end indices of the new selection

// direction (optional) - "forward", "backward", or "none" (default)

element.setSelectionRange(3, 5);

// Select text in element 'elm'

const elm = document.getElementById('elm');

​

// Clear any current selection

const selection = window.getSelection();

selection.removeAllRanges();

​

// Select paragraph

const range = document.createRange();

range.selectNodeContents(elm);

selection.addRange(range);

const getSelectedText = () => window.getSelection().toString();

​

getSelectedText();

​