javascript - 使用 django 和 javascript 点击自动填充字段

Question

我开始编写代码，当我单击旧请求中已使用的值时自动填充字段，因此我这样做了:

从 JavaScript 代码中的循环中获取值:

{% for x in request.session.query_x reversed %}
var x_point = "{{x}}"
{% endfor %}

function autoFill() {
  document.getElementById('input1').value = x_point;
}

列表是从循环创建的，我想每次单击每个值来填充字段(html) - 我得到了列表，并且这部分中的一切都运行良好:

  {% for x in request.session.query_x reversed %}
      X: <a href="#" onClick="autoFill();">{{x}}</a><br>
  {% endfor %}

将接收值的字段:

<div class="form-group floating-label-form-group controls mb-0 pb-2"><label>X</label><input class="form-control" type="text" id="input1" required="" placeholder="X"<br>

重点是，我单击循环中的任何值时，我都会从循环中获得第一个值，而不是从该位置获得正确的值。我在这里缺少什么？

Answer 1

您将在每次迭代中覆盖 x_point 值:

{% for x in request.session.query_x reversed %}
    var x_point = "{{x}}"
{% endfor %}

将事件作为参数发送，这样您就可以避免链接默认行为并获取内部文本:

{% for x in request.session.query_x reversed %}
    X: <a href="#" onClick="autoFill(event);">{{x}}</a><br>
{% endfor %}

function autoFill(e) {
    // Avoid default link behaviour (scroll to #)
    e.preventDefault();
    // Assign link text
    document.getElementById('input1').value = e.target.innerText;
}