Question

If a tag like DIV, MARQUEE or IMG is inserted, it can be selected when clicking anywhere in the tag area. However, if a TABLE is inserted, it can only be selected when clicking on the border of tag area. I have searched for the possible event (onclick, keydown) defined for DIV, but unfortunately no relevant Javascript code was found. DesignMode is used for the editor. Anyone knows how to make TABLE easier to be selected just like a DIV?

Answer 1

You can do it using a ControlRange and selecting it. Assuming the table element is stored in a variable called “table”:

table.onclick = function() {
    if (document.selection.type != "Control") {
        var range = document.body.createControlRange();
        range.add(this);
        range.select();
    }
};

jsFiddle: http://jsfiddle.net/DTK8j/