Html 将用户输入的文本添加到超链接_Html

Html 将用户输入的文本添加到超链接

html

Html 将用户输入的文本添加到超链接,html,Html,首先，我对网络开发知之甚少我想在网站上创建一个文本框，用户在其中输入数字。在这种情况下26 当用户单击“发送”按钮时，我想打开一个新的URL链接，即“.000webhostapp.com/aboutme.html/26” 最后一个参数是输入的数字。我之所以希望这样做，是因为用户单击Send，它将打开一个android应用程序，并将第二个参数传递给该应用程序。应用程序部分工作正常。我现在只需要知道如何做HTML部分有人能帮忙吗我第一次尝试web开发： <HTML> <h

首先，我对网络开发知之甚少

我想在网站上创建一个文本框，用户在其中输入数字。在这种情况下26

当用户单击“发送”按钮时，我想打开一个新的URL链接，即“.000webhostapp.com/aboutme.html/26”

最后一个参数是输入的数字。我之所以希望这样做，是因为用户单击Send，它将打开一个android应用程序，并将第二个参数传递给该应用程序。应用程序部分工作正常。我现在只需要知道如何做HTML部分

有人能帮忙吗

我第一次尝试web开发：

<HTML>

<head>
<title>Hello, CLAIM YOUR R3000! </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<nav>
    <ul>
        <li><a href="aboutme.html/1234">DEEP LINK</li>
        <li><a href="aboutme.html">About me</a></li>
        <li><a href="contactme.html">Contact me</a></li>
    </ul>
</nav>
<h1>Department</h1>
<p>D</p>
<img src="https://i.imgur.com/cmtv1kO.png" alt="Space Doggo and the moon">
<h3>Frist to sign up!</h3>

<h2>Leave your awesome comment</h2>
<form>
    <input placeholder="Your number" type="text" id="num" name="number">
    
</form>
<a href="aboutme.html/num"><button>Send</button></a>
</body>

</html>


您好，请认领您的R3000！




部门
D
首先报名！
留下你的精彩评论

不要用

标记包装提交按钮，而是创建

eventListeners

，以便将输入用作参数


您好，请认领您的R3000！




部门
D
首先报名！
留下你的精彩评论
发送
函数gotour（）{
让number=document.getElementById（“num”）.value；
让url='aboutme.html/num'+number；
窗口打开（url）；
}
document.querySelector（“.submit”）。addEventListener（“点击”，GoTour）；

不要用

标记包装提交按钮，而是创建

eventListeners

，以便将输入用作参数


您好，请认领您的R3000！




部门
D
首先报名！
留下你的精彩评论
发送
函数gotour（）{
让number=document.getElementById（“num”）.value；
让url='aboutme.html/num'+number；
窗口打开（url）；
}
document.querySelector（“.submit”）。addEventListener（“点击”，GoTour）；

尝试使用Javascript处理表单提交事件，并使用window.open在url中的“/”后面追加数字

使用：

window.open（“./aboutme.html/”+document.getElementById（“num”）.value，

“\u blank”

）
在浏览器中打开新选项卡。
document.getElementById（“YourForm”）.addEventListener（“提交”，函数（e）{
e、 预防默认值（）；
window.open（“./aboutme.html/”+document.getElementById（“num”）.value）；
})

您好，请认领您的R3000！





部门
D
首先报名！
留下你的精彩评论
发送
尝试使用Javascript处理表单提交事件，并使用window.open在url中的“/”后面追加数字
使用：window.open（“./aboutme.html/”+document.getElementById（“num”）.value，
“\u blank”）
在浏览器中打开新选项卡。
document.getElementById（“YourForm”）.addEventListener（“提交”，函数（e）{
e、 预防默认值（）；
window.open（“./aboutme.html/”+document.getElementById（“num”）.value）；
})

您好，请认领您的R3000！





部门
D
首先报名！
留下你的精彩评论
发送
我的答案将与我在编辑时其他人已经说过的内容非常接近，但我希望能更深入地了解它的工作原理
首先，如果您想了解web开发，请访问
您几乎可以在这里使用常规HTML表单，但它实际上可以导航到.000webhostapp.com/aboutme.HTML/？number=26
。这正是我在下面写的一个例子。如果您可以调整服务器端，它可能是您的最佳选择
现在，如果您确实需要导航到.000webhostapp.com/aboutme.html/26
，那么您需要使用Javascript以某种方式操纵URL。请参见下面的详细示例
此外，您还可以使用HTML和正确的
类型（即number
）进行一些改进。也在那里实施

window.addEventListener（'DOMContentLoaded'，e=>{//Exec脚本，当加载和解析HTML时
const frm=document.querySelector（'#num form'）；
frm.addEventListener（'submit'，e=>{
//阻止表单实际提交
e、 预防默认值（）；
//读取输入
设val=frm.number.value；
//表单具有验证功能，但我们从不信任用户输入
如果（！val&&val！='0'）{//无值：退出
返回；
}
val=parseInt（val）；//如果值不是数字，则将失败，这很好！
让url=frm.getAttribute（'action'）；//从HTML获取url：更易于编辑，更接近标准
url+=val；//追加编号
log（“导航到”，url）；
//window.location.href=url；//
我的答案将接近于其他人在我编辑它时所说的，但我希望能带来更多关于如何工作的见解
首先，如果您想了解web开发，请访问
您几乎可以在这里使用常规HTML表单，但实际上它可以导航到.000webhostapp.com/aboutme.HTML/？number=26
。我在下面写的表单就是这样。如果您可以调整服务器端，它可能是您的最佳选择
现在，如果您真的需要导航到.000webhostapp.com/aboutme.html/26
，那么您将需要使用Javascript以某种方式操纵URL。请参阅下面的详细示例
此外，您还可以使用HTML和正确的
类型（即number
）进行一些改进。这些改进也在那里实现

window.addEventListener（'DOMContentLoaded'，e=>{//Exec脚本，当加载和解析HTML时
const frm=document.querySelector（'#num form'）；
财务管理硕士