带有输入数据的Javascript输出结果

我是javascript的新手，我正在制作一个简单的脚本，它将显示输入字段中输入数据的附加链接，基本上它应该从

input

字段中获取数据，并生成与输入字段中提交的数据的链接

与下面的示例类似

输入：tony@mail.com单击“发送”按钮后

处理

输出链接：www.domain.com/route.php？电子邮件=tony@mail.com

我发现这个代码和我的类似，但它不会像我正在寻找的那样工作

<p>Enter your email or User ID 
<input type="text" name="foo" id="foosite" value="" />
<a href="#"
   onclick="this.href = ('http://' + document.getElementById('foosite').value + 'www.domain.com/route.php?email=')"
   target="_blank">send</a>

输入您的电子邮件或用户ID

---

在javascript中，这样的脚本是否可以生成输出而无需重新加载页面？

您可以将表单添加到html代码中，并使用表单提交将数据发送到服务器，在这种情况下，您可以在提交到自定义链接之前更改表单的操作

<form name="form1" action="" onSubmit="onsubmit(this)">
    <p>
        Enter your email or User ID
        <input type="text" name="foo" id="foosite" value="" />
        <input type="submit" value="send" />
    </p>
 </form>


 <script>
   function onsubmit(form)
   {  
    //change the action of the form to your link.
     form.submit();
   }
  </script>

输入您的电子邮件或用户ID

提交函数（表单）
{  
//将表单的操作更改为链接。
表单提交（）；
}

您将getelement放在错误的位置。如果你想这样做，应该是这样的

<input type="text" name="foo" id="foosite1" value="" />
<a href="#" onclick="this.href = ('http://www.domain.com/route.php?email=' + document.getElementById('foosite1').value)" target="_blank">send</a>

<input type="text" name="foo" id="foosite2" value="" />
<a href="#" onclick="this.href = ('http://www.domain.com/route.php?email=' + document.getElementById('foosite2').value)" target="_blank">send</a>

---

将JS逻辑与HTML分离

HTML

<p>Enter your email or User ID 
    <input type="text" name="foo" id="foosite" value="" />
</p>
<a href="#" id='link' target="_blank">send</a>
<div id="url_value"></div>

---

非常感谢您的回答，但我希望它能在第页显示结果。发送时不要转到链接。是否可以在页面上显示输出链接？？？@dcodesmith Cool！这就是我想要的，最后一个问题。是否可以从一个输入生成多个输出链接？谢谢！是的，当然！我让它回答：）非常感谢。你能告诉我如何制作多个输出链接吗？

var a = document.getElementById('link')
a.onclick = function(e){
    e.preventDefault();
    var value = document.getElementById('foosite').value;
    var route = "http://www.domain.com/route.php?email=" + value + ',  ';
    var data = "http://www.domain.com/data.php?email=" + value + ',  ';
    var form = "http://www.domain.com/form.php?email=" + value;

    document.getElementById('url_value').innerHTML = route + data + form
}