ボタンをクリックしたときに（テキストエリア（入力）===「何か」）別のページにリダイレクト

Question

これは私が近づいた方法です。助けてください：

検索

<script type="text/javascript"> 
    var criteria = document.getElementById("search").val().toLowerCase(); 

    if (criteria == "crosshatching") { 
     document.getElementById("searchBtn").onclick = function() { 
      window.location.href = "https://www.youtube.com/watch?v=117AN3MQuVs"; 
     } 
    } 
</script> 

Answer 1

をあなたが入力内のイベントハンドラの値をチェックする必要があります。また、コメントに指摘されているように、val()の代わりにvalueを使用してください。

document.getElementById('searchBtn').addEventListener('click', function() { 
 
    var criteria = document.getElementById('search').value.toLowerCase(); 
 
    if (criteria === "crosshatching") { 
 
     console.log('You would be redirected here!') 
 
     location.href = 'https://www.youtube.com/watch?v=117AN3MQuVs' 
 
    } else { 
 
     console.log('No redirect. You wrote: ' + criteria) 
 
    } 
 
})

<input id="search" type="text"/> 
 
<button id="searchBtn">Search</button>

Answer 2

関数内の変数criteriaのための余地はありませんでした。 .val()はjQuery用で、代わりにJavascriptの.valueを使用します。
コードを変更しました。 作業コード以下を確認してください：

document.getElementById("searchBtn").onclick = function() { 
 
    var criteria = document.getElementById("search").value.toLowerCase(); 
 

 
    if (criteria == "crosshatching") { 
 
     alert("Matching"); 
 
     window.location.href = "https://www.youtube.com/watch?v=117AN3MQuVs"; 
 
    } else { 
 
     alert("NOT Matching"); 
 
    } 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea name="search" id="search"></textarea> 
 
<button id="searchBtn">Search</button>