CODEWITHSUNDEEP
jquery
smz
smz

Reputation: 51

select div when clicked according to z-index value

I am very much confused how to get the div id I want. If I am going to click the div layer3 , all DIVs(parent divs) also include into it.

HTML:

<div id="parentdiv">
    <div style="z-index:0 ; border:1px solid; width:200px; height:200px;" id="layer1">
        <div style="z-index:1 ; border:1px solid; width:150px; height:150px;" id="layer2">
            <div style="z-index:2 ; border:1px solid; width:100px; height:100px;" id="layer3">
                INNER DIV content
            </div>
        </div>
    </div>
</div>

Thank you so much

Upvotes: 1

Views: 65

Answers (3)

svenbravo7
svenbravo7

Reputation: 317

I also came across this same problem when I bind a click to a list that had inner lists. So i changed my code a little for your example.

$('#parentdiv').on('click', 'div', function (e)
{
    // Stops the inner div elements to also call their parent div
    e.stopPropagation();
});

This will allow you to be able to click on all the children of the #parentdiv. The e.stopPropagation() is a native Javascript method that prevents your click from going up in the DOM tree.

Upvotes: 1

usman allam
usman allam

Reputation: 284

$('#layer3').click(function() {
    alert($(this).text()); //should be alert INNER DIV content
});

Upvotes: 0

albhilazo
albhilazo

Reputation: 221

You should share your code so we understand exactly what you want, but maybe you just need to set a handler for the div:

$('#layer3').click(function() {
    // your code
});

Upvotes: 0

Related Questions