Question

我想点击一个按钮，然后转到将mypage.html与搜索框中输入的值连接起来的链接，但它似乎不会将其识别为变量。如何获取文本框的值？

<html>
<form role="search" action="mypage.html/'#searchterm'">

          <input type="text"  placeholder="Search" id="searchterm">

        <button type="submit">Search</button>
 </form>
</html>

Answer 1

将表单元素更改为：

<form role="search" id="myForm" action="mypage.html">

javascript（这是jQuery）将是这样的：

$( "#myForm" ).submit(function( event ) {
    // Get the search term
    var searchTerm = $('#searchterm').val();

    // Append the search term to the root URL
    var url = "mypage.html/" + searchTerm;

    // Redirect the page to the new URL
    window.location.href = url;

    // Prevents the default behavior of the form
    event.preventDefault();
});

Answer 2

这取决于您希望如何实现这一点，您可以使用PHP直接发送它，或者您可以使用javascript和AJAX将其发送到PHP页面。正如您在this小教程中所看到的，您可以发送输入的输入值。 AJAX将避免在您搜索数据时刷新页面，因此它看起来会更好。这一切都取决于你想要达到的目标。

请注意，输入的值不能在表单的¨action¨属性上发送。

Answer 3

感谢所有提交答案的人，我实际上想出了这个答案。

<html>
<input type="text" id="myInput">
<button onclick="go()">Click me</button>
<script>
function go(value)
{

window.open("mypage.html/" + document.getElementById('myInput').value)

}
</script>

</html>

点击按钮，通过Id获取表单文本框的值

3 个答案: