新しいタブでJavascriptのキーを開くページを開く

私は検索ボックスを使って作業していますが、私はコードに反映されている複数の修正を試しました。検索ボタンをクリックすると、検索バーが機能し、検索ページに移動します。ただし、Enterキーを押すと、現在のページの最新バージョンを新しいタブにプルするだけです。誰かがこれを修正する方法を知っていますか？新しいタブでJavascriptのキーを開くページを開く

<!DOCTYPE html> 
<html> 
<head> 
<title>Home</title> 
<link rel="stylesheet" type="text/css" href="Main.css"> 
</head> 
<body></body> 
<div class="body"></div> 
     <div class="grad"></div> 
     <div class="header"> 
      <div>Abuse<span>Caboose</span></div> 
     </div> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <a href="login.html">Login</a> 
     <br /> 
     <br /> 
     <a href="Media_Page.html">Media</a> 
     <br /> 
     <br /> 
     <a href="Bios.html">Our Team List </a> 
     <br /> 
     <br /> 
     <a href="ContactUs.html">Contact Us! </a> 
     <br /> 
     <br /> 
     <img src="http://res.cloudinary.com/lmn/image/upload/e_sharpen:150,f_auto,fl_lossy,q_80/v1/gameskinny/5edfe8862832766bd1c9a38e6a9821eb.jpg" alt="I am Support" title="Image" width="400" height="200" /> 
     <br /> 
     <br /> 
     <br /> 
     <br /> 
     <div id="tfheader"> 
     <form target="_blank"> 
       <div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeypress="return searchit()"></div> 
       <br /> 
    <a id="searchbutton" href="" onclick="searchit()" target="_blank" onkeypress="return searchit()">Search</a> 
    </form> 
    </div> 
<script> 
const baseUrl = "https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q="; 
var userurl; 
var enterurl; 
function urlinput(event){ 
var text = event.target.value; 
text = text.replace(" ", "+"); 
userurl = text; 
var searchButton = document.getElementById('searchbutton').href="baseUrl"; 
} 
    function searchit() 
    { 
    document.getElementById("searchbutton").href= baseUrl + userurl; 
    } 
</script> 
</html>

出典

2017-01-27 zac libbey

[スタックオーバーフローに関する[最小限の、完全で検証可能なサンプルの作成方法]（http://stackoverflow.com/help/mcve）を参照してください。 – Steeve

テキストボックスはフォーム内にあり、入力時にデフォルトでフォームを送信します。 onsubmit関数を処理して、フォームの既定の送信動作をオーバーライドします。この関数からfalseを返すと、フォームは送信されません。

<form target="_blank" onsubmit='return handleSubmit();'> 
    <div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeypress="return searchit()"></div> 
    <br /> 
    <a id="searchbutton" href="" onclick="searchit()" target="_blank" onkeypress="return searchit()">Search</a> 
</form> 


<script> 
    function handleSubmit() { 
    return false; 
    } 
</script>

出典

2017-01-27 15:22:23

私はevent.preventDefault（）を使用しようとしました。それでも同じように振る舞いました。私もevent.stopPropagation（）を試みました。 –

あなたのケースは私が思っていたものと少し異なります。フォームのonsubmit関数をオーバーライドします。私の更新された答えを見てください。 –

私はあなたの修正プログラムを実装しようとしましたが、それはまだ同じものを起動しています。あたかもonsubmitコマンドを使用していないかのように思えます。 –

これは簡単な修正です。フォームタグを削除するだけで、検索を処理するJavaスクリプトがあるので、このタグは必要ありません。これで問題は解決します。

出典

2017-01-27 16:14:48 Thanga

<!DOCTYPE html> 
    <html> 
    <head> 
    <title>Home</title> 
    <link rel="stylesheet" type="text/css" href="Main.css"> 
    </head> 
    <body></body> 
    <div class="body"></div> 
      <div class="grad"></div> 
      <div class="header"> 
       <div>Abuse<span>Caboose</span></div> 
      </div> 
      <br /> 
      <br /> 
      <br /> 
      <br /> 
      <a href="login.html">Login</a> 
      <br /> 
      <br /> 
      <a href="Media_Page.html">Media</a> 
      <br /> 
      <br /> 
      <a href="Bios.html">Our Team List </a> 
      <br /> 
      <br /> 
      <a href="ContactUs.html">Contact Us! </a> 
      <br /> 
      <br /> 
      <img src="http://res.cloudinary.com/lmn/image/upload/e_sharpen:150,f_auto,fl_lossy,q_80/v1/gameskinny/5edfe8862832766bd1c9a38e6a9821eb.jpg" alt="I am Support" title="Image" width="400" height="200" /> 
      <br /> 
      <br /> 
      <br /> 
      <br /> 
      <div id="tfheader"> 
      <form> 
        <div><input type="text" placeholder="Search Google" onchange="urlinput(event)" onkeydown="newSearchit();"></div> 
        <br /> 
     <a id="searchbutton" href="" onclick="searchit()" onkeypress="return searchit()">Search</a> 
     </form> 
     </div> 
    <script> 
    const baseUrl = "https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q="; 
    var userurl; 
    var enterurl; 
    function urlinput(event){ 
    var text = event.target.value; 
    text = text.replace(" ", "+"); 
    userurl = text; 
    var searchButton = document.getElementById('searchbutton').href="baseUrl"; 
    } 
     function searchit() 
     { 
     //alert('Inhere'); 
     document.getElementById("searchbutton").href= baseUrl + userurl; 
     } 

     function newSearchit() 
     { 
     if(event.keyCode == 13) { 
      document.getElementById("searchbutton").click(); 
     } 
     } 
    </script> 
    </html>

試してみてください！

出典

2017-01-27 16:43:24

新しいタブでJavascriptのキーを開くページを開く

答えて

関連する問題