Selection in javascript

Question

I want to get selection of block of text (including div's and formatting), I have function 'text_redesign' that should do it and I call it onlick to some button. But it select only the place in button where I clicked, i.e. on button is written "Restructure" and if I click close to 'R', I will get "R span class="someclass_tigran" /span estructure", and if I click close to 't', than I get "Restruc span class="someclass_tigran"/span ture". So it gets the place where I clicked, but not the selected text.

function text_redesign()
{
    var text_comonent_area = $("#text_block_1").contents().find('iframe'); //.contents();
    //var len = text_comonent_area.value.length;
    //var start = text_comonent_area.selectionStart;
    //var end = text_comonent_area.selectionEnd;
    //var sel = text_comonent_area.value.substring(start, end);
    //console.log("start " + start + " end " + end);
    var selObj = window.getSelection()
    console.log(selObj);
    var selRange = selObj.getRangeAt(0);
    console.log(selRange);
    if(selObj.getRangeAt){ // thats for FF
        console.log("sdfsdf33");
        var range = selObj.getRangeAt(0);
        var newNode = document.createElement("span");
        newNode.setAttribute('class', 'someclass_tigran');
        range.surroundContents(newNode);
    }

}

P.S. I want apply it to iframe, but I tried as inside frame and well as to document and the result is same. I am new to selection, so if you know where my mistake can be, please, tell and I will google it. Now I have no idea what to search for.

Not sure i understand your issue. Could you provide relevant HTML markup too? If you select some text in a DIV and then click a button, you loose selection. So what is expected behaviour? — A. Wolff
– A. Wolff, Commented Dec 15, 2013 at 12:45
Expected: selected area (inc. div's and formatiing) will be surronded by span. No, I do not lose selection. It remain, but funtion select button instead. — Tigran
– Tigran, Commented Dec 15, 2013 at 12:48
Sorry, yes. I loose selection. <div class="button_top" title="" onclick="text_redesign();">Restructure</div> — Tigran
– Tigran, Commented Dec 15, 2013 at 12:49

Community · Accepted Answer · 2017-05-23 11:56:45Z

1

I think it may be better to check the selected text in text_redesign function.

Look at this example: How to replace selected text with html in a contenteditable element?

edited May 23, 2017 at 11:56

CommunityBot

11 silver badge

answered Dec 15, 2013 at 12:44

Sho

2941 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Tigran Over a year ago

The problem was that area was diselected when I pressed the button.

Collectives™ on Stack Overflow

Selection in javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related