Как определить две разные функции на основе щелчка по событию? ⇐ Jquery

[Anonymous]

JS-скрипт: https://jsfiddle.net/k140nad9/6/
HTML-код ниже:

Код: Выделить всё

FUNCTION A


FUNCTION B


MAP

И этот JS-код:

Код: Выделить всё

var map = document.getElementById('map')
var btnA = document.getElementById('btnA')
var btnB = document.getElementById('btnB')

function openFunctionA() {
if($('#btnA').is(":checked")){
$('#btnB').attr('disabled', true)
map.addEventListener('click', function(e){
alert("THIS FUNCTION A")
})
} else {
$('#btnB').attr('disabled', false)
}
}

function openFunctionB() {
if($('#btnB').is(":checked")){
$('#btnA').attr('disabled', true)
map.addEventListener('click', function(e){
alert("THIS FUNCTION B")
})
} else {
$('#btnA').attr('disabled', false)
}
}

• Нажмите флажок «Функция A», чтобы отметить его, но затем не нажимайте карту div
• Снова щелкните флажок «Функция A», чтобы снять флажок, затем нажмите флажок «Функция B».
• После пункта 2 сначала появится всплывающее окно «ЭТА ФУНКЦИЯ А», а не всплывающее окно «ЭТА ФУНКЦИЯ Б».

Как это исправить, чтобы, когда я устанавливаю флажок «Функция B» (на основе пункта 3 выше), я получаю только всплывающее окно «ЭТА ФУНКЦИЯ B».

Подробнее здесь: https://stackoverflow.com/questions/791 ... vent-click