CODEWITHSUNDEEP
jquery
user10001110101
user10001110101

Reputation: 321

Get text under mouse click

I have a div that contains multiple lines of "free" text.

<div id="ItemQueue">&nbsp;
    <b>ADDED</b><br />
    102<br />
    103
</div>

When a user clicks on one of these text items such as 102 or 103, I need to get the text under the mouse where clicked within the div. My attempt is below however, this returns all of the text in the div not just the text that is under the mouse.

var queue = $('#ItemQueue');
queue.click(function (e) {
    alert($(e.target).text());
});

Upvotes: 0

Views: 879

Answers (3)

Liath
Liath

Reputation: 10191

Personally I'd split them into paragraphs/headers

<div id="ItemQueue">&nbsp;
    <h1 class="Clickable">ADDED</h4>
    <p class="Clickable">102</p>
    <p class="Clickable">103</p>
</div>

Then I'd use the JQuery

$('.Clickable').click(function(){
   alert($(this).html());
});

Upvotes: 2

Mohammad Masoudian
Mohammad Masoudian

Reputation: 3491

i think its better to use class like this :

HTML :

<div id="ItemQueue">&nbsp;
    <b class="span">ADDED</b><br />
    <span class="span">102</span><br />
    <span class="span">103</span>
</div>

JQUERY:

$('.span').click(function(){
   alert($(this).html());
});

Upvotes: 1

Spokey
Spokey

Reputation: 10994

$('#ItemQueue').contents().wrap('<span/>')

$('#ItemQueue > span').click(function () {
    alert($(this).text());
});

Upvotes: 2

Related Questions