青いやつの進捗日記。

べんきょうのしんちょくをかいていきます。

window.openでウィンドウをポップアップさせる

window.open

JSでwindow.openとやるとウィンドウをポップアップで出せます。

また、hrefにそのウィンドウのURL入れるとおもうんですけど普通にやるとポップアップも出すのと同時に遷移しちゃうので、その動作自体の無効化が必要です。

aタグの無効化 - preventDefaultとreturn falseの違いとか - Qiita

a(href='#####', data-window-width='560', data-window-height='500' class='js-popup')
forEach(document.querySelectorAll('.js-popup'), ($target) => {

      const windowWidth = $target.getAttribute('data-window-width');
      const windowHeight = $target.getAttribute('data-window-height');

      $target.addEventListener('click', ($element) => {

        $element.preventDefault();
        window.open($target.getAttribute('href'), null, `width=${windowWidth}, height=${windowHeight}`);
      });
    });
  }

これでポップアップウィンドウを出せます。