使用JS或JQuery将URL变量放入HTML表单

时间:2015-12-02 01:48:57

标签: javascript jquery html forms

我正在尝试像这样在URL中传递变量以填充HTML和Liquid表单并在填充后提交:

http://www.example.com/login?customer_email=admin@website.com&customer_password=123456

我发现的最接近我想要达到的是this question。我失去了弹珠,因为我不明白变量是如何放入表格的。

有人可以分解吗/解释一下吗?

以下是表单代码:



    {% form 'customer_login' %}

      <h1>Login</h1>

      {% include 'form-errors-custom' %}

      <label for="customer_email" class="hidden-label">Email Address</label>
      <input type="email" value="" name="customer[email]" id="customer_email" placeholder="Email" {% if form.errors contains "email" %} class="error"{% endif %} autocorrect="off" autocapitalize="off" autofocus>

      {% if form.password_needed %}

        <label for="customer_password" class="hidden-label">Password</label>
        <input type="password" value="" name="customer[password]" id="customer_password" placeholder="Password" {% if form.errors contains "password" %} class="error"{% endif %}>

        <p>
          <a href="#" onclick="showRecoverPasswordForm();return false;">Forgot your password?</a>
        </p>

      {% endif %}

      <div class="text-center">
        <p>
          <input type="submit" class="btn" value="Sign In">
        </p>
        or <a href="{{ shop.url }}">Return to Store</a>
      </div>

    {% endform %}
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

在您的情况下,在网址中传递的参数与get请求类似,并且可以通过与使用method="get"接收表单提交的参数相同的方式接收。然后将变量放在当前页面中表单字段的value属性中。

答案 1 :(得分:0)

如果您希望从URL客户端获取参数(使用JS / Jquery,根据您的标记),您可以获取查询字符串(使用location.search)并提取键/值对,然后根据自己的意愿分配它们。

//var str = location.search

var str = 'customer_email=admin@website.com&customer_password=123456';
var pairs = str.split('&');
var email = pairs[0].split('=')[1];
var password = pairs[1].split('=')[1];
$('#customer_email').val(email);
$('#customer_password').val(password);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 <input type="email" value="" name="customer[email]" id="customer_email" placeholder="Email" autocorrect="off" autocapitalize="off" autofocus>


<input type="password" value="" name="customer[password]" id="customer_password" placeholder="Password" class="error"{% endif %}>