Javascript: как заставить эту функцию работать для эффектов клика

Question

Я разрабатываю страницу, на которой отображаются сведения о персонале в следующей структуре:

пользователь может щелкнуть в любом месте окна сведений, и флажок будет установлен вместе с изменением в className окна сведений <div>.

Проблема, с которой я сталкиваюсь, заключается в том, что когда я щелкаю в любом месте окна сведений, он работает нормально ... но когда я нажимаю на флажок, он только меняет className, но не вносит никаких изменений в флажок.

Также существует одно условие: нескольким пользователям разрешено одновременно выбирать ограниченный персонал, и немногим разрешено выбирать всех из них.

Я назначил функцию myClick () для внешнего поля <div> (с красной рамкой) и функция:

var selectedCount = 0;
myClick = function(myObj,event)
{
    var trgt =(event.srcElement) ?  event.srcElement : event.target;
    tgName = trgt.tagName;
    //following statement gives me correct details element event though i clicked on any child tags
    theElem = (tgName == 'DIV') ? trgt : ( (tgName == 'B') ? trgt.parentNode.parentNode  : trgt.parentNode);

    if(allowed_selection == 'unlimited')
    {
        if(theElem.className == 'details_clicked')
        {
            theElem.className = 'details';  
            theElem.getElementsByTagName('input')[0].checked = false;
        }
        else if(theElem.className == 'details_hover')
        {
            theElem.className = 'details_clicked';
            if(tgName != 'INPUT') theElem.getElementsByTagName('input')[0].checked = true;
        }
    }
    else 
    {
        if(theElem.className == 'details_clicked')
        {
            theElem.className = 'details';
            theElem.getElementsByTagName('input')[0].checked = false;
            selectedCount--;
        }
        else if(theElem.className == 'details_hover')
        {
            if(selectedCount == allowed_selection ) return false;
            theElem.className = 'details_clicked';
                    //i think, this is the suspicious area for errors 
            theElem.getElementsByTagName('input')[0].checked = true;
            selectedCount++;
        }
    }
    return false;
};

Answer 1

Проблема заключается в том, что в вашей функции есть следующие строки возврата:

return false;

Когда вы подключаете событие к элементу формы, который выполняет действие, такое как флажок или кнопка, возврат false будет препятствовать этому действию по умолчанию,Он останавливает событие, как обычно.

Вы можете попробовать что-то вроде этого в верхней части своей функции:

var returnValue = (tgName == 'INPUT' && trgt.type == "checkbox") ? true : false;

А затем при вызове return использовать:

return returnValue;

Если вы вернете true, вы позволите флажку работать в обычном режиме и отметите / снимите флажок.