开发者

dont want dialog to open

I'v got a page that list my contacts, every contact is wrapped in a div that onClick opens a modal dialog that shows more info about that contact.

NOW, on the page every contact is listed with name and email, and as said above clicking on a users "box" will result in a dialog being shown. But i want it so that when i click on the email (link of course) that the dialog does not show and default mailhandler opens instead.

The way it works now default mail handler (outlook) opens AND the user dialog opens too... I've tried to destroy and close the dialog when i click on the email but the dialog is probably opened after...

Any good fix?

EDIT: I think I have some good answers, but it need some adoption... what if the code on my page looked like this:

<ul id="us开发者_开发问答ers">
    <li onClick="OpenUserDialog(usersId);">
        blablala
        <span onClick="OpenMail(usersMail);">usersMail<span>
    </li>
</ul>

So when i click the userMail the onClick on the <li> is also run but I don' want that.


You can select the mail links and in their handler, cancel the event propagation.

Assuming a HTML layout like this:

<div class="popupOpener">
    <a href="mailto:me@example.com">mail me</a>
</div>

Then try this code:

$('div.popupOpener').click(function () {
    openPopup();
});

$('a[href^="mailto:"]').click(function (e) {
    e.stopPropagation();
});

Update in response to edit:

You should avoid attaching events to elements in that way. You are already using jQuery, and it excels at this exact task. Change your HTML to look like this:

<ul id="users">
    <li data-userId="usersId"> <!-- I assume this is coming from the server -->
        blablala
        <a href="mailto:usersMail">usersMail</a>
    </li>
</ul>

And then this jQuery will work:

$('#users')
    .children('li')
    .click(function () {
        openPopup($(this).data('userId'));  // not 100% sure on the syntax here
    })
    .children('a')
    .click(function (e) {
        e.stopPropagation(); // this stops the event from going any further (and 
                             // reaching the <li>, but doesn't stop the default
                             // browser behaviour (which is to open the link)
    })
;


It sounds like you need to stop propagation on the onclick event, in jQuery for example

$("#myDiv").click(function(event){
  event.stopPropagation();  
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜