javascript/jquery 更改 location.href答案

【问题标题】：javascript/jquery to change location.hrefjavascript/jquery 更改 location.href
【发布时间】：2013-03-06 19:41:49
【问题描述】：

这是我的 HTML

        <form id="procurar-novo">
          <input type="text" name="procurar" placeholder="Pesquisar no Site" value="">
          <input id="procurar-submit" type="button" value="&rsaquo;">
        </form>

这是我的 jQuery

<script type="text/javascript">
  $(document).ready(function(){
    $('#procurar').submit(function(e) {
      e.preventDefault();
      //edited
      window.open = ('http://www.psicotropicus.org/'+'/busca'+encodeURIComponent($('#procurar-submit').val()), '_blank');
      return false;
    });
  });
</script>

想法是通过点击提交，javascript/jquery 将获取#procurar-submit 值并将其添加到 URL 并重定向用户。

_blank 仍然不起作用

提前致谢。

【问题讨论】：

太棒了，有什么问题？
它不像我编码的那样工作。
为什么不把表单作为普通的GET提交？
怎么样：<form action="http://psicotropicus.org" method="GET">?
我被重定向到psicotropicus.org/?procurar=aaa 并在同一个窗口中。我应该被重定向到psicotropicus.org/busca/aaa

标签： javascript window.location submit-button

【解决方案1】：

使用带有第二个参数_blank的window.open

window.open('url', '_blank');

也试试这个：

<script type="text/javascript">
  $(document).ready(function(){
    $('#procurar').submit(function(e) {
      e.preventDefault();
      //edited
      window.open = ('http://www.psicotropicus.org/'+'/busca'+encodeURIComponent($('#procurar-submit').val()), '_blank');
      return false;
    });
  });
</script>

上次编辑：

<script>
  $(document).ready(function(){
    $('form#procurar-novo').submit(function(e) {
      //e.preventDefault();
      //edited
      var url = 'http://www.psicotropicus.org'+'/busca'+ encodeURIComponent('&' + $('input[name=procurar]').val());
       window.open(url, '_blank');
      return false;
    });
  });
</script>

<form id="procurar-novo">
          <input type="text" name="procurar" placeholder="Pesquisar no Site" value="">
          <input id="submitsss" type="submit" value="&rsaquo;">
</form>

请考虑表单元素的名称和 ID :)

【讨论】：

你能帮我解决这个问题吗：想法是通过点击提交，javascript/jquery 将获得#procurar-submit 值并将其添加到 URL 并重定向用户。在新标签上打开它只是次要问题。
当我搜索“aa”而不是那个链接时，它仍然将我重定向到psicotropicus.org/busca?procurar=aa。它没有在新标签中打开。但我想我们快到了！
@Rafael：使用不同的浏览器并再次检查，window.open 是唯一的解决方案
好的。但 URL 仍然不正确。输入类型有区别吗？
我试过了，没用。我刚刚编辑了我的帖子，以便您查看标记和我尝试的最后一个脚本。

【解决方案2】：

您的表单标签上似乎没有指定操作。为什么不直接将第二个输入元素从type=submit 更改为type=button。然后，您可以在该按钮上绑定一个单击事件，并完全控制接下来会发生什么。您不必担心会阻止默认提交操作。您可以执行以下操作：

$(document).ready(function(){
  $(document).on('click', '#procurar-submit', function() {
    window.location.href = 'http://www.psicotropicus.org/busca'+$('input[name="procurar"]').val();
  });
});

要在“_blank”上打开一个新窗口，您可以将代码更改为：

$(document).ready(function(){
  $(document).on('click', '#procurar-submit', function() {
    window.open('http://www.psicotropicus.org/busca'+$(input[name="procurar"]).val(), '_blank');
  });
});

但要小心弹出窗口拦截器

编辑我更改了获取文本字段值的选择器。我可能会在该文本字段上添加一个类或 ID，以便可以将其与其他字段区分开来。看到这个fiddle

【讨论】：

感谢您的提示。我更改了“按钮”的类型，但 javascript 似乎仍然无法正常工作。我被重定向到rflbrz.zz.mu/psico/?procurar=lalala 而不是你写的。
那个域甚至与代码中的域不一样？还有什么不同吗？
实际上，将类型更改为按钮使其不起作用。当它是提交类型时，我至少被重定向到上面的 URL。
这是我用来测试东西的域。
在不提交表单时使用输入 type=submit 似乎很懒惰。如果你真的想使用表单，为什么不做类似 cmets 中提到的@zzzzBov 并实际使用操作？