2017-04-07 54 views
0

我使用MailChimp將字段合併到URL中,指示人們在我的網站上完成表單。我想用URL中的信息預先填充文本框。使用來自電子郵件合併的URL使用Java腳本填充Web表單文本框

例如:http://www.sitename.com/page?fname=John&lname=Smith&[email protected]

我是一個新手,在這一點,不知道我在做什麼錯在這裏。這是我的核心代碼:

<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> 
+0

看來好像你正在使用jQuery,但你正確地使用它,我不認爲。 '$ .extend'返回一個合併兩個對象屬性的對象。您只有一個對象,並且不使用輸出的對象。我會讓自己更容易,並使用像[url.js](http://jillix.github.io/url.js/)之類的URL解析庫。 –

回答

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]; 
 
    } 
 
});

相關問題