Tell me, please, how to make it so that once again not to write calls modalki, by type:

$('#button-1').on('click', function() { $('#modal-1').addClass('j-modal--open'); }); $('#button-2').on('click', function() { $('#modal-2').addClass('j-modal--open'); }); 

and so on, and write something like this:

 var modal__id = $('a[href^="#j-form"]').val(); $('a[href^="#j-form"]').on('click', function() { $(modal__id).addClass('j-modal--open'); }); 

Where the contents of href are entered into a variable and when clicking on a link, there is an id with the same name and the j-modal class is added to it - open

That is, when you click:

 <a href="#j-form__какой-то-id">Нажать тут</a> 

The window opened:

 <div id="j-form__какой-то-id">Контент модалки</div> 

    2 answers 2

    When you click on the link, we take the value of the href attribute, then look for an element with such an id and add a class:

     $('a[href^="#j-form"]').on('click', function() { var id = $(this).attr('href'); $(id).addClass('j-modal--open'); }); 
    • Thanks for the help - jsp

    HTML:

     <a href="#j-form__какой-то-id" class="js-modal-open">Нажать тут</a> <a href="#j-form__какой-то-другой-id" class="js-modal-open">Нажать тут</a> 

    Js:

     $('.js-modal-open').on('click', function(e) { e.preventDefault(); $(this.hash).addClass('j-modal--open'); }); 
    • Thanks It works! - jsp
    • @jsp Href and hash mixed up - tutankhamun