Увольнение модальное вручную, которое обычно срабатывает при нажатии ссылки.

Question

Im работает с некоторым кодом JS, так как Im front front im im имеет некоторые проблемы, чтобы выяснить, как инициировать событие на JS, которое обычно срабатывает при нажатии ссылки.

Это ссылка:

<a href="#modal-text" class="call-modal" title="Clicking this link shows the modal">Demo</a> 

И функция JS, что перехват нажмите на эту ссылку в:

(function (global) { 

    'use strict'; 

    // Storage variable 
    var modal = {}; 

    // Store for currently active element 
    modal.lastActive = undefined; 
    modal.activeElement = undefined; 

    // Polyfill addEventListener for IE8 (only very basic) 
    modal._addEventListener = function (element, event, callback) { 
     if (element.addEventListener) { 
      element.addEventListener(event, callback, false); 
     } else { 
      element.attachEvent('on' + event, callback); 
     } 
    }; 

    // Hide overlay when ESC is pressed 
    modal._addEventListener(document, 'keyup', function (event) { 
     var hash = window.location.hash.replace('#', ''); 

     // If hash is not set 
     if (hash === '' || hash === '!') { 
      return; 
     } 

     // If key ESC is pressed 
     if (event.keyCode === 27) { 
      window.location.hash = '!'; 

      if (modal.lastActive) { 
       return false; 
      } 

      // Unfocus 
      modal.removeFocus(); 
     } 
    }, false); 

    // Convenience function to trigger event 
    modal._dispatchEvent = function (event, modal) { 
     var eventTigger; 

     if (!document.createEvent) { 
      return; 
     } 

     eventTigger = document.createEvent('Event'); 

     eventTigger.initEvent(event, true, true); 
     eventTigger.customData = { 'modal': modal }; 

     document.dispatchEvent(eventTigger); 
    }; 


    // When showing overlay, prevent background from scrolling 
    modal.mainHandler = function() { 
     var hash = window.location.hash.replace('#', ''); 
     var modalElement = document.getElementById(hash); 
     var htmlClasses = document.documentElement.className; 
     var modalChild; 

     // If the hash element exists 
     if (modalElement) { 

      // Get first element in selected element 
      modalChild = modalElement.children[0]; 

      // When we deal with a modal and body-class `has-overlay` is not set 
      if (modalChild && modalChild.className.match(/modal-inner/) && 
        !htmlClasses.match(/has-overlay/)) { 

       // Set an html class to prevent scrolling 
       //document.documentElement.className += ' has-overlay'; 

       // Mark modal as active 
       modalElement.className += ' is-active'; 
       modal.activeElement = modalElement; 

       // Set the focus to the modal 
       modal.setFocus(hash); 

       // Fire an event 
       modal._dispatchEvent('cssmodal:show', modal.activeElement); 
      } 
     } else { 
      document.documentElement.className = 
        htmlClasses.replace(' has-overlay', ''); 

      // If activeElement is already defined, delete it 
      if (modal.activeElement) { 
       modal.activeElement.className = 
         modal.activeElement.className.replace(' is-active', ''); 

       // Fire an event 
       modal._dispatchEvent('cssmodal:hide', modal.activeElement); 

       // Reset active element 
       modal.activeElement = null; 

       // Unfocus 
       modal.removeFocus(); 
      } 
     } 
    }; 

    modal._addEventListener(window, 'hashchange', modal.mainHandler); 
    modal._addEventListener(window, 'load', modal.mainHandler); 

    /* 
    * Accessibility 
    */ 

    // Focus modal 
    modal.setFocus = function() { 
     if (modal.activeElement) { 

      // Set element with last focus 
      modal.lastActive = document.activeElement; 

      // New focussing 
      modal.activeElement.focus(); 
     } 
    }; 

    // Unfocus 
    modal.removeFocus = function() { 
     if (modal.lastActive) { 
      modal.lastActive.focus(); 
     } 
    }; 

    // Export CSSModal into global space 
    global.CSSModal = modal; 

}(window)); 

Как я могу вызвать функцию, которая вызывается, когда пользователь нажимает кнопку ссылку, но вручную на моей странице, что-то вроде <script>firelightbox(parameters);</script>

Answer 1

Использование JQuery будет решить эту проблему легко

$('.selector').click(); 

но обычный старый JavaScript также может иметь решение для вас

Давайте просто дать якорь элемент идентификатор (для простоты)

<a id="anchorToBeClicked" href="#modal-text" class="call-modal" title="Clicking this link shows the modal">Demo</a> 

Давайте создадим функцию, имитирующую щелчок

function simulateClick() { 
    var evt = document.createEvent("MouseEvents"); 
    evt.initMouseEvent("click", true, true, window, 
    0, 0, 0, 0, 0, false, false, false, false, 0, null); 
    var cb = document.getElementById("anchorToBeClicked"); 
    cb.dispatchEvent(evt); 
    } 

Теперь называют эту функцию на window.onload

window.onload = function() { 
    simulateClick(); 
}; 

EDIT:

На самом деле, код, который вы используете, не работаете на реальном событии щелчка анкерного тега, вместо этого он полагается на хэш-изменение Url в вашем окне браузера. Вы можете просто вызвать эту функциональность, используя

window.onload = function() { 
    location.hash = '#modal-text' 
}; 

Answer 2

Если вы используете jQuery, вы можете вызвать щелчок ссылки на загрузку страницы, используя этот код:

$(document).ready(function(){ 
    $('.call-modal').click(); 
});