2016-03-25 28 views
0

誰でもこのスクリプトを手伝ってもらえますか?送信ボタンが付いたテキストボックスが必要です。特定のIDが入力されたら、特定のサイトにリダイレクトする必要があります(スクリプトの例はyahoo、bingなどです)。javascriptがURLリダイレクトで機能しない

以下はこれまでの内容ですが、送信ボタンは表示されず、送信ボタンが押されてもスクリプトを実行していないようです。

私はちょうど#を得る? URLに追加されました...私はopencartで働いていますので、問題の一部はopencartであると思います。

<html> 
<head> 
<script> 
document.getElementById("gobutton").addEventListener("click", function(event){ 
event.preventDefault() 
var idmap={ 
REDDIT:"http://reddit.com", 
YAHOO:"http://yahoo.com", 
BING:"http://bing.com" 
}; 
id=document.getElementById("siteid").value; 
if (id in idmap) { 
alert("going to "+idmap[id]); 
window.location.href=idmap[id]; 
} else { 
alert("invalid code ["+id+"]") 
} 
event.preventDefault() 

}); 
</Script> 
</Head> 
<Body> 

<form id="urllauncher" action='#'> 
<label for="siteid">Site id</label> 
<input type="text" id="siteid"> 
<button type="submit" id="gobutton">Go</button> 
</form> 

</Body> 
</Html> 

ありがとうございました!

+0

'window.location.href = idmap [id];' 'window.location = idmap [id];'を使用します。 – animaacija

答えて

1

あなたは本文の最後にスクリプトを追加する必要があります)、これらを削除し、event.preventDefault(タイプを提出するのも、すべての

のフォームを持っているために必要はありませんだと思う

0

あなたがそのフォームタグを削除すると、あなたの問題をすべて解決できると思います。私はそれだけで

0

document.getElementById("gobutton").addEventListenerはまだ早すぎます。この時点では、buttonはページDOMにはまだ存在しないため、イベントは接続されていません。

の作業コード:

<html> 
    <body> 
     <form id="urllauncher" action='#'> 
      <label for="siteid">Site id</label> 
      <input type="text" id="siteid"> 
      <button type="submit" id="gobutton">Go</button> 
     </form> 

     <script> 
      document.getElementById("gobutton").addEventListener("click", function(event){ 
       event.preventDefault() 
       var idmap = { 
        REDDIT:"http://reddit.com", 
        YAHOO:"http://yahoo.com", 
        BING:"http://bing.com" 
       }; 
       var id = document.getElementById("siteid").value; 
       if(id in idmap) { 
        alert("going to "+idmap[id]); 
        window.location.href=idmap[id]; 
       } else { 
        alert("invalid code ["+id+"]") 
       } 
      }); 
     </script> 
    </body> 
</html> 

PS:それを投稿する前にあなたのコードをインデントしてみてください!

関連する問題