使用Javascript函數通過onSubmit向url添加參數

Question

我想使用onsubmit將html參數添加到url。 我有2個表單（1個GET，1個POST），想要使用1個按鈕將它們都提交（使用POST表單按鈕）。當按下提交按鈕時，請使用onSubmit調用javascript函數，其中參數“附加”到了網址。

我正在考慮做這樣的事情：

function onSubmitForm() {
    url = "localhost:8080/test/index.php?Title=document.getElementsByName('title')[0].value";
    //I don't know how to actually call the url.
}

編輯

我得到了我想要的： 將表單輸入值附加到動作url作為路徑

Answer 1

首先，您必須串聯字符串的靜態和動態部分。 然后，您可以重定向。

function onSubmitForm() {
  window.location = "localhost:8080/test/index.php?Title=" + 
    document.querySelector('title').textContent;
}

筆記：

• 僅表單字段具有.value屬性。 如果嘗試獲取元素中的文本，則可以使用.textContent 。
• .getElementsByName()掃描整個文檔，並收集所有匹配元素。 當您知道只想要第一個，並且在<title>的情況下，文檔中永遠只有其中一個時，這是浪費的。 使用.querySelector()僅定位第一個匹配的元素。

Answer 2

ES6

注意事項：

• 不要忘記使用Babel在ES5中轉換代碼。

我打算給你這個解決方案：

 function onSubmitForm() { window.location = `localhost:8080/test/index.php? Title=${document.querySelector('title').textContent}` } 

讓我解釋一下，在我們不得不將符號+ ourVariable +字符串的延續連接起來之前，使用反引號進行這種處理的方法甚至比ES5更簡單。

在這里，我們還有更多。 我們也可以寫幾行。 然后${}用於在內部傳遞變量

所需的文檔： 文字模板字符串