Question

请不要将此问题标记为无效。我没有在stackoverflow中找到与下面提到的问题有关的任何问题。

我有一个django模板。我将以下上下文传递给它

context = {
'1_title': 'Title 1',
'2_title': 'Title 2',
'3_title': 'Title 3',
'4_title': 'Title 4',
}
return render(request, 'index.html', context)

我有一个HTML文件，其中有一个下拉菜单。下拉列表的值类似于1,2,3,4。我已经向它注册了onClick函数。

我需要实现此功能。我将在onClick函数中获取该值。然后，我将接收到的值与_title串联起来，并向其中存储一个javascript变量。现在，我需要使用该javascript变量来引用django上下文。我无法实现这一目标。我用谷歌搜索并在stackoverflow中进行了广泛的搜索。似乎没有人回答我的问题。

javascript函数如下所示：

function getContextValue(value) {
var key = value + '_title'; 
return {{ key }}
}

如果我在下拉菜单中选择1，则上述功能的键将为1_title。我需要从上下文（即标题1）返回1_title值。

对我来说，它不起作用，仅返回1_title。我什至尝试过return {{'key'}}。在此返回键。

Stackoverflow社区请客气。对于您来说，这可能是一个简单的问题，但对我而言，不是。

Answer 1

如果您想访问JS中的上下文信息，则需要以某种方式将其传递给JS。

将上下文更改为类似内容，以便在模板中更轻松地访问。

context = {}
context['data_for_select'] = {
'1_title': 'Title 1',
'2_title': 'Title 2',
'3_title': 'Title 3',
'4_title': 'Title 4',
}
return render(request, 'index.html', context)

我假设您的模板中包含以下内容：

<select name="dropdown">
  {% for key, title in data_for_select.items %}
    <option value="{{key}}">{{title}}</option>
  {% endfor %}
</select>

您现在可以为JS方法在DOM中的某个位置呈现上下文数据。 Django提供了一个方便的模板过滤器，称为 json_script https://docs.djangoproject.com/en/3.0/ref/templates/builtins/#json-script

{{ data_for_select|json_script:"select-data" }}

您可以在JS中使用它，例如：

var data = JSON.parse(document.getElementById('select-data').textContent);

这样，您就可以将模板上下文数据公开给JS。

在Django模板中使用Javascript变量的值来呈现模板上下文

1 个答案: