0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

フォームに特定の文字列を入力して別ページにジャンプする方法

Posted at

#入力フォームで特定の文字列を入力するとあるページにジャンプする秘密の合言葉的な動きをさせたい!

##秘密の合言葉でページを開けたらかっこいいと思いません?
なおかついろいろ応用が利きそうだと感じたので共有させていただきます。

    <form>
          <input type="text" id="input_message" value="">
          <input type="button" onclick="func1()" value="ジャンプ">
        </form>

        <script language="javascript" type="text/javascript">
          function func1() {
       var input_message = document.getElementById("input_message").value;
            if(input_message == '自分が決めた言葉'){ 
             window.location.href="飛んでほしいページのリンク";
           }  
          }
        </script>

##スクリプトの説明
入力、送信フォームを作るformタグの中にinputタグで入力フォーム、ボタンを作成。

その下に、scriptタグでJavascritを作成
func1という関数をつくりまず入力された文字列を取得
次に、if文で入力された文字列と自分が決めた文字列を比較して
trueならwindow.location.hrefでURLを設定
すると、自分が決めた文字列を入力しジャンプボタンをクリックすると設定したリンクへジャンプすることができるようになる。

##別タブで開きたい場合
設定したリンクを別のタブで開きたい場合は

window.open('URL','_brank');

で別タブで開くことができる。

###最後に
コードの改良点がございましたらコメントしていただけるとありがたいです。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?