2

我希望能得到一点帮助。

我已经设置了一个表单,它从#keyword 中提取值并将其作为 url 提交。

该页面是 http://mysite.com/tags

我有两个问题:

  1. .toLowerCase 不起作用
  2. url 会更新,尽管它添加了关键字输入的名称(即关键字),如下所示:http://mysite.com/tags?keyword=MYKEYWORD

我希望 io 看起来像这样:http://mysite.com/tags/mykeyword

这是我到目前为止的代码:

$(document).ready(function() {
     $('#tag-search').click(function() {
          goUrl = http://mysite.com/ + $('#keyword').val().toLowerCase();
          window.location = goUrl;
     });
});

和形式:

<form id="tagForm" class="uniForm">
<fieldset class="inlineLabels">
    <div class="ctrlHolder">
        <label for="keyword">Tag Keyword</label>
        <input id="keyword" name="keyword" value="" size="35" class="textInput required" type="text" />
        <p class="formHint">Add your tag keyword and hit submit</p>
        </div>
    <div class="buttonHolder"><button type="submit" id="tag-search" class="primaryAction">Submit</button></div>
</fieldset>
</form>
4

5 回答 5

4

您的表单当前正在执行默认行为 - 即获取当前 URL(因为您尚未指定操作或方法),查询字符串参数从输入表单的值中提取。

要停止默认行为,您需要确保您return false来自事件处理程序:

$(document).ready(function() {
     $('#tag-search').click(function() {
          goUrl = 'http://mysite.com/' + $('#keyword').val().toLowerCase();
          window.location = goUrl;
          return false;  // Prevent the default button behaviour
     });
     $('#tagForm').submit( function() {
          return false;  // May be necessary to prevent the default form behaviour
     });
});

正如其他人还指出的那样,您需要在将基本站点 url 分配给时将其括在引号中goUrl,以确保将其视为字符串。

更新正如 Stofke 建议的那样,将您的重定向逻辑从按钮的click处理程序移动到表单的处理程序可能是明智的:submit

$(document).ready(function() {
     $('#tagForm').submit( function() {              
          goUrl = 'http://mysite.com/' + $('#keyword').val().toLowerCase();
          window.location = goUrl;
          return false;  // Prevent the default form behaviour
     });
});

请记住,除了单击“提交”按钮之外,还有其他提交表单的方法,例如Enter在文本框中点击键 - 使用您的实现,当用户在“关键字”文本框内点击 Enter 时,他们仍然会结束在 http://mysite.com/tags?keyword=MYKEYWORD 而不是 http://mysite.com/tags/mykeyword。

于 2011-02-19T22:32:43.040 回答
1
$(document).ready(function() {
     $('#tag-search').click(function() {
          goUrl = 'http://mysite.com/' + $('#keyword').attr('value').toLowerCase();
          window.location = goUrl;
     });
});
于 2011-02-19T22:31:19.653 回答
0

像这样在 url 周围加上引号:

'http://mysite.com/'
于 2011-02-19T22:31:07.823 回答
0

您缺少 URL 第一部分的引号

$(document).ready(function() {
 $('#tag-search').click(function() {
      goUrl = 'http://mysite.com/' + $('#keyword').val().toLowerCase();
      window.location = goUrl;
 });

});

于 2011-02-19T22:32:00.137 回答
0

使用.submit()而不是.click( )返回 false;以防止表单执行它的默认行为,即执行 GET 请求。不需要两者都做。

$(document).ready(function() {
    $('#tagForm').submit(function() {    
        goUrl = 'http://mysite.com/' + $('#keyword').val().toLowerCase();
        window.location = goUrl;
        return false;
    });
});
于 2011-02-19T23:08:21.487 回答