使用用户输入修改链接

Modifying a link with user input

本文关键字：修改 链接 输入 用户      更新时间：2023-09-26

我正在为一个函数处理一小段代码，实际上我在另一个问题的答案中找到了这些代码，这是一个巨大的帮助。不过，试图修改该脚本片段给了我一些麻烦：我试图更改这一点，以便它不会用链接更改显示的文本，而是用静态文本（如"单击此处"）或按钮元素修改链接。

<a id="reflectedlink" href="http://www.google.com/search">http://www.google.com/search</a>
<input id="searchterm"/>
<script type="text/javascript">
   var link= document.getElementById('reflectedlink');
   var input= document.getElementById('searchterm');
   input.onchange=input.onkeyup= function() 
      {
         link.search= '?q='+encodeURIComponent(input.value);
         link.firstChild.data= link.href;     
      }; 
</script>

我真的很想有一个简单的按钮，在一个新窗口中打开修改后的链接。我尝试过寻找类似的解决方案，我确信我错过了，只是因为我不知道我在寻找什么。

修改了你的小提琴：

HTML

Search <input id="searchterm" type="text" />

JavaScript

var searchterm = document.getElementById('searchterm');
var base_url = 'http://www.google.com/search?q=';
searchterm.onchange = searchterm.onkeyup = function(e) {
    e = e || event;
    if ( (e.which || e.keyCode) == 13 ){
        window.open(base_url + encodeURIComponent(searchterm.value), '_blank');
    }
};

有关window.open函数的更多信息，请点击此处。

相关文章：