jquery - jQuery Change click behavior in Edit Mode

Question

I have a simple media gallery with images that click through to other pages. I also have an "Edit" mode that allows the user to change the media gallery name, description and delete photos etc. While in "Edit" mode, I'd like to disable the default click action on the photos, and make it so that you can "select" multiple images when clicking on them. Then, buy clicking "Cancel" or "OK", the regular default image click HREFs are restored. I have the following code that kind of works in parts, but I am getting strange behavior. Any ideas on what I am doing wrong here or a better way to achieve this?

$(".editAlbumButton").click(function() {
    $("#editTools").show();
    $(".mediaClick").preventDefault();
    $(".mediaClick").toggle(function() {
        $(this).addClass('mediaSelectHighlight');
        }, function() {
        $(this).removeClass('mediaSelectHighlight');
    });
}); 

$(".cancelButton").click(function() {
    $(".mediaClick").removeClass('mediaSelectHighlight');
    $("#editTools").hide();
    $(".mediaClick"). ??? (); // I don't know how to "Restore" default click action here ?
}); 

Answer 1

Try binding and unbinding the events, depending on which mode is active.

$(".editAlbumButton").click(function() {
    $(".mediaclick").unbind("click", /*hanlder*/);
}
...
$(".cancelButton").click(function() {
   $(".mediaclick").bind("click", /*handler*/);
}

Answer 2

为什么不使用例如可编辑的标志。

var editable=false;
$(".editAlbumButton").click(function() {
    $("#editTools").show();
    editable=true;
    $(".mediaClick").toggle(function() {
        $(this).addClass('mediaSelectHighlight');
        }, function() {
        $(this).removeClass('mediaSelectHighlight');
    });
});
$(".cancelButton").click(function() {
    $(".mediaClick").removeClass('mediaSelectHighlight');
    $("#editTools").hide();
    editable=false;
});
$(".mediaClick").click(function() {
    if(editable){
        $(this).preventDefault();
        return;
    }
});