Question

我的页面上有这个：

$('.editable-question').editable('{{my_identifier}}/form_item/edit',{
                    //loadurl: 'example/restful/url/in/app/{{???????????????}}',
                    type   : 'textarea',
                    cancel : 'Cancel',
                    submit : 'OK',                  
                    name   : 'edit_this',
                  });

我在jinja模板中的Flask应用程序中使用jeditable。问题是，我需要将信息传递给'loadurl'以检索未格式化的markdown文本，但我不知道如何从css中获取一些内容到loadurl语句中：

<div id="f4d629f9f0" class="editable-question" style="">
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</p>
</div>

这种情况我希望将css id转换为{{????????}}。这通常是怎么做的？似乎是一个常见问题，但我还没有一个问题或答案。我想更多rtfm'ing。

一个不太紧迫的问题是我需要在某些时候从jinja模板中删除我的js，但我不确定如何将我需要的变量放入页面然后进入js：我想隐藏的元素和/或url引用js根据需要获取变量。

编辑：

我最终得到了类似的东西：

$('.editable-question').editable('/form_item/edit',{
                    id: 'my_id',
                    loadurl: 'node',
                    type   : 'textarea',
                    cancel : 'Cancel',
                    submit : 'OK',                  
                    name   : 'edit_this',
                  });

和my_id通过jeditable作为url param（？my_id = {{css id}}）传递，但它感觉很脏，我更喜欢一个安静的网址，但需要让事情完成，所以继续前进。

Answer 1

我不知道我的理解是否正确？但我想出了三个答案：

1）如果你在你的HTML模板中包含你的js，jinja可以渲染HTML和js。对于jinja来说，模板HTML，TXT，CSS或JS中的数据类型并不重要。

2）您可以在HTML模板的隐藏字段中传递变量，并使用dom操作（如jquery）从dom中获取变量。

3）您可以在HTML中包含一个小javascript，其中只包含一个带变量的函数。在外部javascript文件中，您可以访问这些函数来获取变量。

为了实现这个想法，这里是HTML模板的一部分，用于配置代码镜像编辑器并在HTML和内联js中使用jinja：

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="/jinjacms/static/jinjacms.css"> 
<link type="text/css" rel="stylesheet" href="/codemirror/lib/codemirror.css">
<link type="text/css" rel="stylesheet" href="/codemirror/theme/rubyblue.css">
<script type="text/javascript" src="/codemirror/lib/codemirror.js"></script>
<script type="text/javascript">
function editor(id)
{
        CodeMirror.fromTextArea(document.getElementById(id), {
        theme: "rubyblue", 
        lineNumbers: true, 
        mode: {{ mode }},
        {% if readonly %}readOnly: "nocursor",{% endif %} 
        tabSize: 4,
        indentUnit: 4,
        indentWithTabs: true,
        tabMode: "shift"
      });
}
</script>
<style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
<title>{{ title }}</title>
</head>
<body onload="editor('text_data');">

jeditable loadurl：引用css id或只是根据需要传入变量

1 个答案: