Javascript 如何根据用户的表单输入创建自定义url供用户共享？_Javascript_Jquery_Forms_Webflow

Javascript 如何根据用户的表单输入创建自定义url供用户共享？

javascript jquery forms

Javascript 如何根据用户的表单输入创建自定义url供用户共享？,javascript,jquery,forms,webflow,Javascript,Jquery,Forms,Webflow,我对编程相当陌生，但想知道如何在我的域名后附加用户的名字/姓氏来创建自定义URL 我有一个表格，要求输入用户名、电子邮件、电话以及他们需要多少孩子。一旦他们提交表单，我希望成功页面显示一个自定义url:domain.com/firstLast，然后理论上他们可以与其他人共享他们的链接以获得可能的折扣我有复制功能，但我似乎无法得到的网址显示。请帮忙 <body> <section> <container> <div> <div .form-

我对编程相当陌生，但想知道如何在我的域名后附加用户的名字/姓氏来创建自定义URL

我有一个表格，要求输入用户名、电子邮件、电话以及他们需要多少孩子。一旦他们提交表单，我希望成功页面显示一个自定义url:domain.com/firstLast，然后理论上他们可以与其他人共享他们的链接以获得可能的折扣

我有复制功能，但我似乎无法得到的网址显示。请帮忙

<body>
<section>
<container>
<div>
<div .form-wrapper>
<form>
<div .slider>
  <div .slide>
    <div .form-content>
      <input type="text" id="name">
    </div> 
  </div> 
  <div .slide>
    <div .form-content>
      <input type="email" id="email">
    </div> 
  </div> 
  <div .slide>
    <div .form-content>
      <input type="tel" id="phone">
      <input type="submit" id="contactMe">
    </div> 
  </div> 
 </div>
</form>
<div class="success-message">
  <div>
    <input type="text" name="share-link" id="share-link">
    <button onclick="myFunction()">Copy Url</button>

<script>
slug = document.getElementById("name").value;
slug = slug.replace(/\s/g, '');
url = "https://babysittingmadeeasy.com/" + slug;
document.getElementById("share-link").value = url;
<script>
....


复制地址
slug=document.getElementById（“名称”）.value；
段塞=段塞。替换（/\s/g'）；
url=”https://babysittingmadeeasy.com/“+鼻涕虫；
document.getElementById（“共享链接”）.value=url；
....

尝试将Javascript移到HTML之后：


复制链接
slug=document.getElementById（“名称”）.value；
段塞=段塞。替换（/\s/g'）；
url=”https://babysittingmadeeasy.com/“+鼻涕虫；
document.getElementById（“共享链接”）.value=url；

由于代码当前已编写，Javascript将在元素

共享链接存在之前执行。
以下是一些问题：
其中是id=“name”的html标记。我还为您添加了1个具有此属性的输入标记
只需替换定义的html标记下面的区域。或者将其放在函数上-确保脚本在创建元素后运行
完成了。这是我的测试和结果：


<input type="text" id="name" class="hidden" value="demoname"/>
<input type="text" name="share-link" id="share-link">
<button onclick="myFunction()">Copy Link</button>


<script>
var slug = document.getElementById("name").value;
slug = slug.replace(/\s/g, '');
url = "https://babysittingmadeeasy.com/" + slug;
document.getElementById("share-link").value = url;
</script>





复制链接
var slug=document.getElementById（“名称”）.value；
段塞=段塞。替换（/\s/g'）；
url=”https://babysittingmadeeasy.com/“+鼻涕虫；
document.getElementById（“共享链接”）.value=url；


在您的表单标签上写上最诚挚的问候
 <form id="onboarding-form">



你的js呢
    <script>
    document.getElementById('onboarding-form').onsubmit = function(event){
           event.preventDefault();
           slug = document.getElementById("name").value;
    
          slug = slug.replace(/\s/g, '');
          url = "https://babysittingmadeeasy.com/" + slug;
          document.getElementById("share-link").value =  url ;
     }
    <script>


document.getElementById（'onboarding-form'）。onsubmit=函数（事件）{
event.preventDefault（）；
slug=document.getElementById（“名称”）.value；
段塞=段塞。替换（/\s/g'）；
url=”https://babysittingmadeeasy.com/“+鼻涕虫；
document.getElementById（“共享链接”）.value=url；
}
您的后端是什么？控制台中是否有错误？您的结束脚本标记不正确。它必须是
。您有两个开始脚本标记，尽管这可能只是您问题中的一个输入错误。@zeterain我刚刚忘记在上面的代码中添加它，它就在Webflow中@我真的不知道。你的成功页面和这个表单有什么不同吗？我试过了。我把它放在标签前的页面末尾，但它仍然不起作用（HTML标记“name”在表单中。表单抱歉，我不清楚。我希望它在单击表单提交按钮时显示，而不是复制链接。我无法附加“onsubmit”你有没有任何id或唯一的表单类名？它的id是登录表单谢谢！我知道它必须是简单的，但我一直在撞墙试图找出什么。你是一个救生员！！！