如何将输入文本字段中键入的url附加到锚点，然后在单击锚点时跟随它？
如何将输入文本字段中键入的url附加到锚点，然后在单击锚点时跟随它？
提问于 2009-09-18 18:46:15
我想有一个文本域，人们可以在其中键入一个值。然后，我想让href打开一个url，并将文本字段附加到末尾。
因此，如果文本字段显示为"elephant“，则当他们单击该链接时，将打开一个页面，显示为example.com/elephant。
我认为javascript是实现这一点的最简单的方法，但我只是不知道该怎么做。
回答 5
Stack Overflow用户
回答已采纳
发布于 2009-09-18 18:53:44
我假设您有一些类似下面的超文本标记语言，并且想要在单击锚标签时将appendUrl输入字段的内容附加到锚标签中的url。
<a href="/base/url" id="baseUrl">Link Text</a>
<input type="text" id="appendUrl" />然后，使用jQuery，它看起来如下所示：
$(function() {
$('#baseUrl').click( function() {
window.location = $(this).attr('href') + '/' + $('#appendUrl').val();
return false;
});
});基本思想是提取输入的值，并将其附加到href中的url。使用如此构造的值来设置当前窗口的位置。我在click处理程序中返回false，以防止执行默认操作(单独的基本url )。
Stack Overflow用户
发布于 2009-09-18 18:54:09
<input type="text" id="suffix" />
<a href="http://example.com/" onclick="document.location.href = $(this).attr('href')+$('#suffix').val(); return false;">click me</a>Stack Overflow用户
发布于 2009-09-18 20:12:53
以下是您想要的库不可知版本：
您的HTML：
<input type="text" name="url_param" id="url_param" />
<input type="button" onclick="prepare_link();" value="Do it!" />
<a href="http://whatever.com" id="target_link">Click Your New Link!</a>你的Javascript：
<script type="text/javascript">
function prepare_link() {
var url_param = document.getElementById('url_param');
var target_link = document.getElementById('target_link');
if ( ! url_param.value ) {
return false;
}
target_link.href = target_link.href + '/' + escape(url_param.value);
}
</script>这不是编写代码的最干净的方式，也不是我想要做的，但是我试图以最通用的方式使它尽可能简单，以便您能够理解代码。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1446268
复制相关文章
相似问题
腾讯云开发者
