將表單輸入值作為路徑附加到操作 url

Question

我有一個這樣的表格：

<form action="http://localhost/test">
    <input type="text" name="keywords">
    <input type="submit" value="Search">
</form>

如果我輸入一個值，讓我們說：在文本輸入字段中輸入“hello”並提交表單，URL 看起來像： http://localhost/test/?keywords=hello 。

我希望將值附加到操作路徑。 所以基本上，在表單提交后，URL 應該如下所示：

http://localhost/test/hello

Answer 1

您可以使用onsubmit屬性並在函數內設置操作，例如：

<form id="your_form" onsubmit="yourFunction()">
    <input type="text" name="keywords">
    <input type="submit" value="Search">
</form>

function yourFunction(){
    var action_src = "http://localhost/test/" + document.getElementsByName("keywords")[0].value;
    var your_form = document.getElementById('your_form');
    your_form.action = action_src ;
}
    

Answer 2

您可以使用onsubmit並使用jQuery來獲得相同的結果。

檢查以下內容。

HTML代碼：

<form id = "your_form" onsubmit="yourFunction()">
    <input type="text" name="keywords">
    <input type="submit" value="Search">
</form>

jQuery代碼：

    function yourFunction(){

    var action_src = $("keywords").val();
    var your_form = $('your_form').val();

    var urlLink = "http://localhost/test/";
    urlLink = urlLink + action_src;



    your_form.action = urlLink;

}