CODEWITHSUNDEEP
jqueryhtmlcssselection
Mave751
Mave751

Reputation: 707

Is it possible to select text inside an <a> tag?

I have the following elements:

<a> <span>text</span> </a>

with a specific action trigged onclick on the link element.
I'm looking for a way to select the text inside the span without triggering the link.
NB. I can't change the code, but, only the CSS.

UPDATE

I'm sorry I wasn't able to specify my aim.
I need to select text, in order to copy and paste it from a site that I can't directly modify.
I know how to do it via javascript, but unfortunately the only thing I can do is to force IE to set a different CSS style.
I'm trying to find a way to change the elements visualization in order to allow mouse selection and prevent the event click to be called.
For example: increasing the <span> height to make it "taller" than the <a> overflowing its parent border.
I'm going to try with CSS position: relative; and re-sizing.
A better solution could be change the z-index of the <span> moving it on a higher layer than the <a>, but I think it is not possible to change it for parent/child elements on IE.

Upvotes: 3

Views: 6564

Answers (5)

Aida
Aida

Reputation: 21

You can use user-select css property.

.example{
user-select: text;
}

Upvotes: 1

Thangneireng Karoung Kom
Thangneireng Karoung Kom

Reputation: 330

Try this:

[*I remove your span as I thought it was not necessary.]

<a id="txtSel" href="javascript:void(0)" onclick="aClick()">your_text<a>

<script type="text/javascript">
    function aClick()
    {
        var myTxt = document.getElementById("txtSel").innerHTML;
        alert(myTxt);
    }
</script>

I hope I understand what you ask....

Upvotes: 0

Tom Bird
Tom Bird

Reputation: 1039

Using jquery you could do something like this:

$('a').children('span').text();

Or

$('a span').text();

Although you would most likely want to bind this with an event, can I ask what are your trying to get the text for?

$('a').on('click', function( e ) {
   e.preventDefault();
   $(this).children('span').text();
});

Upvotes: 0

Riju Mahna
Riju Mahna

Reputation: 6926

Not possible using CSS at all... You'll need at least javascript change.

Just try the simple jQuery snippet. Call a method myMethod(this) on click:

<a href = "javascript : myMethod(this)l" ><span>text</span> </a>

and then 

function myMethod (currObj) {
var temp = $(currObj).find(span).text();
//alert(temp); -- just to test

}

Hope it helps

Upvotes: 0

Nocmear
Nocmear

Reputation: 94

How about "<a href="javascript:void(0)"> <span>text<span\> </a>"

Then you can select the text inside the span without trigger the link.

Upvotes: 0

Related Questions