プログラミング逆引き辞典

~ 多言語対応のプログラミングレシピ ~

JavaScript 画面遷移方法

■onClickイベントで画面遷移

基本構文

location.href="URL"

 

【使用例】

<!DOCTYPE html>
    <html lang="ja">
    <head>
        <meta charset="utf-8">
        <title>sample</title>
    </head>
    <body>
        <div>
            <input type="button" value="プログラミング逆引き辞典" onClick="action()">
        </div>
    <script>
        function action() {
            alert("プログラミング逆引き辞典へ遷移");
            location.href="https://learning-collection.com/"
        }
    </script>
    </body>
</html>

 
 


■リンク押下時にJavaScriptを実行して画面遷移

基本構文

<a href="javascript: 関数名"></a>

 

【使用例】

<!DOCTYPE html>
    <html lang="ja">
    <head>
        <meta charset="utf-8">
        <title>sample</title>
    </head>
    <body>
        <div>
            <a href="javascript: action()">プログラミング逆引き辞典</a>
        </div>
    <script>
        function action() {
            alert("プログラミング逆引き辞典へ遷移");
            location.href="https://learning-collection.com/"
        }
    </script>
    </body>
</html>