使用来自电子邮件合并的URL以使用Java Script填充Web表单文本框

时间:2017-04-07 17:13:19

标签: javascript function parsing urlparse geturl

我正在使用MailChimp将字段合并到一个URL中,指示人们在我的网站上填写表单。我想使用URL中的信息预填充文本框。

ex:http://www.sitename.com/page?fname=John&lname=Smith&email=jsmith@email.com

我是这样的新手,不知道我在这里做错了什么。这是我的核心代码:

<head>

<script>
$.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return $.getUrlVars()[name];
  }
});
</script>

</head>

<body>

    <form id="form_id_name" method="POST" action="/forms/users">

    <label for="fname">First Name:</label>
    <input required="" class="text" id="user_first_name" name="user[first_name]" type="text" />

<script>
$("#user_first_name").val($.getUrlVar("fname"));
</script>  

    <label for="lname">Last Name:</label>
    <input class="text" id="user_last_name" name="user[last_name]" type="text" />

<script>
$("#user_last_name").val($.getUrlVar("lname"));
</script>  

    <label for="email">Email Address:</label>
    <input class="text" id="user_email" name="user[email]" type="email" />

<script>
$("#user_email").val($.getUrlVar("email"));
</script> 

    <input type="submit" name="commit" value="Submit" />

  </form>

</body>

1 个答案:

答案 0 :(得分:0)

问题是,正如@Mike McCaughan所提到的那样,你什么都没有。至于我可以看到你在哪里使用该函数,你正在尝试创建一个jquery函数/插件。试试这个

$.fn.extend({
  getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
      hash = hashes[i].split('=');
      vars.push(hash[0]);
      vars[hash[0]] = hash[1];
    }
    return vars;
  },
  getUrlVar: function(name){
    return $.getUrlVars()[name];
  }
});