How to put into a variable only the text that was selected within a textarea?

Question

With

var texto = document.getElementById('texto').value;

I get everything that’s in the tetxarea that has this id, but what if I want a partial text?

For example the whole text is this:

Germany bought the game against Brazil

If I just select "bought the game", I would like my var to have this content.

Added (11/5/15):

Well, with "mouseup" Alert works, but so, if I simply need to put the value of the selection within a variable with

 var textoSelecionado = showSelection(this);

and then try to use this value?

My ultimate goal is to be able to put HTML tags around the selected text.

However if I click on the link/image/button that performs this function automatically the text is no longer selected and so I tested the function "showSelection" is no longer effective.

I figured out a way to make it functional: enabling and disabling the buttons, so if they are active when selecting the text in the "mouseup" it undergoes the changes. If they don’t have assets they don’t change. It would be like controlling whether or not to use the showSelection function. This I think I can do, but I would like to retain the selected text to use it by clicking on a button or link.

Answer 1

I found an answer on Soen which I have adapted. So with this function you can retrieve what is selected.

HTML

<textarea name="" id="texto" cols="30" rows="10">Texto de exemplo</textarea>

JS

function showSelection(textComponent) {
    var selectedText;
    // IE version
    if (document.selection != undefined) {
        textComponent.focus();
        var sel = document.selection.createRange();
        selectedText = sel.text;
    }
    // Mozilla version
    else if (textComponent.selectionStart != undefined) {
        var startPos = textComponent.selectionStart;
        var endPos = textComponent.selectionEnd;
        selectedText = textComponent.value.substring(startPos, endPos)
    }
    return selectedText;
}

var textarea = document.getElementById('texto');
textarea.addEventListener('mouseup', function () {
    var textoSelecionado = showSelection(this);
    if (textoSelecionado) alert(textoSelecionado);
});

jsFiddle: http://jsfiddle.net/a1tc9984/