Add a checkbox on top of a clickable div

How do I add a checkbox on top of a clickable element, that won't send the click event to the clickable element? (To generalize the question - add a non-clickable element on top of a clickable element)

Example here: http://jsbin.com/uyecaq/4/edit

Thanks!

To Clarify - When the checkbox is clicked, the div that it sits in should not receive the click event.

Answers


You can try this..

$('.checkboxpart').click(function(event){
event.stopPropagation();
});

This one will bind a click on checkbox, overriding default action. The click on the div occurs due to Event propagation. So we need to stop that.

Hope this helps..:)


Try adding:

$('.checkboxpart').click(function(e) {
    e.stopPropagation();
});

Need Your Help

ASP.Net RSS feed

asp.net .net-2.0 webforms rss

How do I create an rss feed in ASP.Net? Is there anything built in to support it? If not, what third-party tools are available?

Mac - List opened windows in terminal

osx applescript osascript

I want to list opened windows in the terminal to get x, y, width and height like xwininfo -root -tree for X11.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.