javascript获取文本框的值

use*_*331 5 javascript onclick

我这里有这个文本框......

<input name="search" type="text" maxlength="512" id="search" class="searchField" autocomplete="off" title="" />
Run Code Online (Sandbox Code Playgroud)

我也有这个提交

<input type="submit" name="btnSearch" value="Search" onclick="location.href='http://www.website.com/search/';" id="btnSearch" class="buttonSearch" />
Run Code Online (Sandbox Code Playgroud)

我想要做的是添加我的文本框中的内容

onclick="location.href='http://www.website.com/search/';"
Run Code Online (Sandbox Code Playgroud)

所以它看起来像这样..

onclick="location.href='http://www.website.com/search/what ever the user searches';"
Run Code Online (Sandbox Code Playgroud)

我怎么会这样做,我一直在谷歌上搜索我的小心脏.

Tom*_*icz 11

请避免混合使用JavaScript和HTML.您可以删除onclick属性,并在加载DOM后在某处使用纯JavaScript替换它:

document.getElementById('btnSearch').onclick = function() {
    var search = document.getElementById('search').value;
    var searchEncoded = encodeURIComponent(search);
    window.location.url = "http://www.website.com/search/" + searchEncoded;
}
Run Code Online (Sandbox Code Playgroud)

还要记住逃避搜索框,例如使用encodeURIComponent().这是一个有效的jsfiddle示例.


neb*_*irl 10

这应该工作:

onclick="location.href='http://www.website.com/search/'+document.getElementById('search').value;"
Run Code Online (Sandbox Code Playgroud)

但我不会在我的一个项目中写这个,因为直接在标签上编写脚本是一种不好的做法.

  • 那么你为什么要发布这个答案呢?在我看来,最好尽可能地阻止不良做法 (2认同)
  • 可能还有人还在学习JavaScript.应遵循最佳做法,但不是强制性的. (2认同)