如何将Bootstrap Table的变量传入JavaScript拼接的HTML字符串引号内

问题核心原因 #

Django 模板标签{% if %}是后端服务端渲染阶段执行的，渲染完成后才会把页面返回给浏览器执行JavaScript代码。你写在JS拼接字符串里的模板标签，在后端渲染的时候根本拿不到JS运行时才会产生的value变量，所以两种写法都不可能生效。

正确实现方式 #

你直接在JavaScript层面判断value的值，动态拼接selected属性即可，不需要混写Django模板语法：

function renderFormat(value) {
  // 提前判断各个选项的选中状态
  const eTextSelected = value === 'eText' ? 'selected="selected"' : ''
  const noMaterialSelected = value === 'No Material' ? 'selected="selected"' : ''
  // 拼接返回HTML字符串（用模板字符串写法更简洁）
  return `<select style="width: 7em" name="Material_format" id="Material_format">
            <option value="">--Select--</option>
            <option value="eText" ${eTextSelected}>eText</option>
            <option value="No Material" ${noMaterialSelected}>No Material</option>
          </select>`
}

如果你习惯使用传统加号拼接字符串的写法，也可以使用下面的兼容版本：

function renderFormat(value) {
return '\n' + ' --Select--\n' + ' <option value="eText" ' + (value === 'eText' ? 'selected="selected"' : '') + '>eText\n' + ' <option value="No Material" ' + (value === 'No Material' ? 'selected="selected"' : '') + '>No Material\n' + ''
}

内容的提问来源于stack exchange，提问作者django