Note that there are some explanatory texts on larger screens.

plurals
  1. POIssue with buttons in <div>, 2nd button acts like 1st one
    primarykey
    data
    text
    <p>I'm trying to figure this out for a whole day and I just can't find the way to make it work.</p> <p>I have a which acts like tooltip. It shows under some on mouseover and it contains 2 buttons.</p> <p>HTML CODE:</p> <pre><code>&lt;label id="name1" class="label" style="width: 150px;"&gt;John Smith &lt;div class="tp"&gt; &lt;!-- this is a tooltip I am talking about and it contains: --&gt; &lt;button type="button" class="button" id="edit1"&gt;Edit&lt;/button&gt; &lt;button type="button" class="button" id="remove1"&gt;Remove&lt;/button&gt; &lt;/div&gt; &lt;!-- end of tooltip --&gt; &lt;/label&gt; </code></pre> <p>CSS Style for tooltip:</p> <pre><code>div.tp { position:absolute; display: none; text-align: center; } label:hover div.tp { position: absolute; display: block; z-index: 140; max-width: 400px; padding: 5px; color: #dadada; background: #000000; border-radius: 4px; } </code></pre> <p>Javascript:</p> <pre><code>$(".tp button[id^=edit]").live('click',function() { alert('This is edit button'); }); $(".tp button[id^=remove]").live('click',function() { alert('This is remove button'); }); </code></pre> <p>The problem is, when I click on first button, it works fine and shows me "This is edit button" but when I click on second (Remove) button, it shows me 2 alerts. First is "This is remove button" and second one is "This is edit button" so basically, it clicks on first button too.</p> <p>I have no problem in Opera browser but in every other (Chrome, IE, FF).</p> <p>UPDATE: Problem doesn't exist if I use buttons outside of tooltip div.</p> <p>Does anybody know what's wrong?</p> <p>Best regards, IceWave</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload