我正在尝试使用 JS 将 ERB 元素插入到我的页面中,但是 insertAdjacentHTML 方法不起作用,只是将我的 erb 元素作为字符串放置
我试过 raw
, .html_safe
和 append()
, 但这些都不起作用。
这基本上就是我想做的
btn_plus.addEventListener('click', () => {
btn_plus.insertAdjacentHTML('beforebegin', `<%= select_tag :rg1, options_from_collection_for_select(@users, 'id', 'email') %>`);
})
结果它只是把<%= select_tag :rg1, options_from_collection_for_select(@users, 'id', 'email') %>
作为我页面上的字符串
正确的做法是什么?
最佳答案
在 .html.erb
中文件,您可以使用 actionview 帮助程序生成如下字符串:
<%= javascript_tag do %>
const foo = '<%= select_tag(:foo, raw("<option>bar</option><option>baz</option>")) %>'
$('#put_it_here').append(foo)
<% end %>
你可以使用options_for_select
也是,但我没有任何方便的东西来检查它,所以我的例子只使用原始 options
标签。
浏览器中的结果输出是:
<script>
//<![CDATA[
const foo = '<select name="foo" id="foo"><option>bish</option><option>bash</option></select>'
$('#put_it_here').append(foo)
//]]>
</script>
您可以在 javascript 表达式中使用字符串 'foo' 将其动态插入到您希望的位置,我在这里使用了 jQuery。
如果你需要使用<select>...</select>
包含的 js 文件中的 html 字符串,您可以在 .html.erb
中声明它文件,然后在包含的文件中使用它。
关于javascript - 使用 JavaScript 插入 ERB,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58065850/