Using cookies...
Using cookies...
Using cookies...

Find out which close button closed an alertbox

74 views Asked by At

I have an alert box with multiple close buttons:

<div data-alert class="alert-box cookies-consent">
    <div class="informative-text">
        Using cookies...
    </div>
    <div class="close-buttons">
        <a href="#" class="close sure">Sure</a>
        <a href="#" class="close opt-out">Opt Out</a>
    </div>
</div>

I registered a handler for the close event as the docs suggest:

$(document).on('close.fndtn.alert', function(event) {
   console.info('An alert box has been closed!');
   console.info(event);
});

But unless I've missed it, the event doesn't seem to indicate which of the buttons was clicked.

How should I modify my HTML/JS to find out which of the close buttons was clicked? I don't want to modify Foundation's own JS, and I do want the UI behavior to remain consistent for both buttons, nice transitions and all.

1

There are 1 answers

1
Geee On BEST ANSWER

Here is working spinet as @Panomosh mentioned above:

$('a.close').on('click',function(e){
  console.log($(e.target).text())
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div data-alert class="alert-box cookies-consent">
    <div class="informative-text">
        Using cookies...
    </div>
    <div class="close-buttons">
        <a href="#" class="close sure">Sure</a>
        <a href="#" class="close opt-out">Opt Out</a>
    </div>
</div>

Greetings!