為JS文檔指定一個errorpage.html。getElementById（'link_id'）。value +'.html'; 如果在目錄中找不到值？

Question

這是彈出搜索功能的功能，當鍵入一個單詞並按下enter鍵時，該功能就會自動出現（handleKeyPress（e）函數會自動說是dogs.html（它是一種兒童語言學習應用程序）。他們輸入的是“ dogg”而不是“ dog”，我希望它轉到指定的錯誤頁面。我根本無法編寫代碼，只能操縱其他人的腳本，例如，該目錄將包含animals.html列表，即dog.html，cat.html等，但是如果鍵入的單詞不在此目錄中

（應該有一個搜索功能來查看* .html是否存在，如果沒有，請轉到錯誤頁面。但是我不能這樣做。我沒有受過訓練。有人可以幫助我嗎？希望我不會再被這個論壇拋棄了，您真的不應該對白痴這么苛刻！！）也就是說，我需要的是：如果.value +'。html'不在目錄中； 轉到errorpage.html

這是“我”的代碼，可加載輸入的任何單詞的頁面：

function goTo()
{
    location.href = document.getElementById('link_id').value + '.html';
    /*window.location.replace("spellcheck.html");*/
}  

function handleKeyPress(e){
     var key=e.keyCode || e.which;
           if (key==13){
           goTo(); 
        /*window.location.replace("spellcheck.html");   */
     }
}

Answer 1

您可能必須使用XmlHttpRequest來檢查文件是否在指定的位置中存在，如果文件不存在，則重定向到錯誤頁面。 但這帶來了自己的一系列問題。

或者，您可以在服務器上創建一個可以告訴您相同的服務。 無論哪種方式都不是那么容易。

Answer 2

如前所述，您可以創建一個數組，該數組可以保存您已知存在於網站中的頁面的所有值。

（有關代碼段的詳細信息，很多注釋文本都包含在內）

JavaScript陣列： https ： //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array

JavaScript .indexOf（）（與數組有關）： https : //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf

JavaScript數組是在方括號內常見的一系列數據。 每個元素都會自動分配一個索引值，以便開發人員可以快速引用特定的部分。 但是，重要的是要知道數組的索引號從0開始。

因此，在此示例中：

const arrayName = ['element1', 'element2', 'page3', 'dog']

• 'element1'在arrayName內部的索引0
• 'element2'在arrayName內的索引1
• 'page3'位於arrayName內的索引2
• 'dog'在arrayName內的索引3

您可以使用JavaScript數組的.indexOf()查找這些數組索引值。 如果數組中不存在元素，則.indexOf()將返回-1（負數）。

arrayName.indexOf( 'dog' ) === 3

 // get the input element that's getting the text const linkID = document.getElementById('link_id'); // get the search button const linkBtn = document.getElementById('link_btn'); // listen for when the keyup event (so when the user is // typing, this will trigger when a key is released) linkID.addEventListener('keyup', (e)=>{ // get the keyCode to test for [ENTER]/13 let key = e.keyCode || e.which; // get the textBox element let target = e.target || e.srcElement; // test if the [ENTER] key was hit if( key === 13 ){ // if [ENTER] test the value processPage( target.value ); } }); // Listen to the click event on the search button to // kick off the process workflow... linkBtn.addEventListener('click', ()=>{ processPage( linkID.value ); }); // Broke this out so that the processing of the text // field can be done by [ENTER] or by clicking a // search button function processPage( val ){ // checkPage will return true/false if the text matches // a page in the array list if( checkPage( val ) ){ // if the page does exist, then kick off the redirect goTo( val ); }else{ // display an error message alert( 'Sorry, the page you are looking for does not exist' ); // reset the value of #link_id linkID.value = ''; } } // This function checks if the text value submitted matches // one of the static pages saved to the array function checkPage( val ){ // pages[] is an array that holds all the pages you know // to exist const pages = ['dog', 'cat', 'bunny']; // .indexOf() will return the array position of a search // query (in this case the value of val) // Arrays start at 0 so if the user searches "dog" the // .indexOf() will provide the answer 0. // If an element does not exist, .indexOf() returns -1 // By assigning this as a condition: // "is the index of val from the array pages[] greater // than or equal to 0?" // we create a condition that will return true/false return ( pages.indexOf( val ) >= 0 ); } function goTo( val ){ console.log( val + '.html' ); // location.href = val + '.html'; } 

 <input type="text" id="link_id" /><button id="link_btn">search</button>