我有一个小型搜索表单,可以执行两种类型的搜索:
<form id="form-navbar-search" class="navbar-search pull-left" action="index.cfm?fuseaction=Search.output" method="post">
<div class="input-append">
<input type="text" name="header_search_criteria" title="Criteria to search" placeholder="search" class="search-query span9" />
<input type="submit" name="quick" value="Quick" title="Search on task ID or task name" class="btn btn-inverse" />
<a href="index.cfm?fuseaction=Search.home" id="navbar-search-full" title="Start a full search" class="btn btn-inverse" />Full</a>
</div>
</form>
index.cfm?fuseaction=Search.output
)。这很有效。a
,我正在设计为一个
按下按钮使用Bootstrap),我想阻止链接打开一个新的
页面,将表单的操作更改为index.cfm?fuseaction=Search.home
,然后提交表单。我已经写了这个jQuery:
$('#navbar-search-full').click( function(event) {
event.preventDefault(); //don't let the link open a new page
$('#form-navbar-search').attr('action', $(this).attr('href')).submit(); //instead, change the search form action, then submit it
})
.attr('href','#navbar-search-full');
作为you can see in this JSFiddle,preventDefault()似乎不会拦截链接操作。 我需要做出哪些调整才能做到这一点?
答案 0 :(得分:1)
return false;
这对你有用......
修改强>
你可以拥有锚点href =“#”,然后使用“data-”属性来存储你的URL。然后锚不会有任何动作,你可以使用.attr(“data-”)...以你决定调用它的方式以相同的方式检索属性..
答案 1 :(得分:1)
我发现了另一个问题:在触发点击处理程序之前,您正在更改#navbar-search-full
的href。
在提交表单之前尝试在.attr('href','#navbar-search-full')
处理程序中移动click
,或者只是将其完全删除。