How to get closed parent div attribute by selected text?

Question

I have a string like below.

<div data-sentence="1"><p>authorised representative (No. 45678) of</p></div>
<div data-sentence="2"><p>you have asked for my advice</p></div>

When user select(drawing) the string like '45678', I can get the the selected text by the function funGetSelectTxt below. My question is how can I get this element's parent div and return back the value of attribute 'data-sentence'?

function funGetSelectTxt() {
    var element = '';
    if (document.selection) {
        element = document.selection.createRange().text;
    } else {
        element = document.getSelection();
    }

    return $.trim(element.toString());
}

Thanks,

can you create a example link so that we can check and let you know. Or paste your html+jquery code here along with libraries links — Alive to die - Anant, May 10 '17 at 07:39
Possible duplicate of http://stackoverflow.com/questions/5669448/get-selected-texts-html-in-div — Finduilas, May 10 '17 at 07:42

score 2 · Answer 1 · answered May 10 '17 at 07:44

Try like this $(this).parent('div').attr('data-sentence')

$('div p').on('mouseup', funGetSelectTxt);

function funGetSelectTxt() {
    var element = '';
    if (document.selection) {
        element = document.selection.createRange().text;
    } else {
        element = document.getSelection();
    }
console.log(element.toString()) //its showing the selected text
console.log($(this).parent('div').attr('data-sentence')) //its get the attr value of parent 
   // return $.trim(element.toString());
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-sentence="1"><p>authorised representative (No. 45678) of</p></div>
<div data-sentence="2"><p>you have asked for my advice</p></div>

score 0 · Answer 2 · answered May 10 '17 at 07:38

0

  $(div).parent().attr('data-sentence');

answered May 10 '17 at 07:38

Saeed Ahmadian

1,112
1
10
21

Mokkun · Answer 3 · 2017-05-10T07:40:37.827

0

With jQuery $(element).parent().attr('data-sentence');

In javascript

var child = document.getElementById("child");
var parent = child.parentNode;
var attr = parent.getAttribute("data-sentence");

edited May 10 '17 at 07:40

answered May 10 '17 at 07:38

Mokkun

708
4
14

score 0 · Answer 4 · answered May 10 '17 at 07:42

0

I'm not sure why everyone still relies so much on jQuery, since some simple tasks are not even easier to write.

So in plain javaScript, the answer is:

element.parentNode.getAttribute('itemprop')

answered May 10 '17 at 07:42

K. Rohde

9,439
1
31
51

score 0 · Accepted Answer · answered May 10 '17 at 07:58

<div data-sentence="1"><p>authorised representative (No. 45678) of</p></div>
<div data-sentence="2"><p>you have asked for my advice</p></div>


$('div p').on('click',function(){
    console.log($(this).parent().attr('data-sentence'));
});

Working Link

https://jsfiddle.net/o2gxgz9r/6822/

How to get closed parent div attribute by selected text?

5 Answers5