在Framework7中用javascript动态呈现范围滑块

我想使用Javascript动态渲染范围滑块（将其附加到

Framework7

移动应用程序中的div

emptypage

）

首先，我尝试添加一个简单的文本元素，该元素可以正常工作（很抱歉，我再也找不到这段代码的源代码作者来给予适当的评价）

但是，在我更改了中的代码之后

var div = document.getElementById('emptypage');
var form = document.createElement('form');
var input1 = document.createElement('input');
input1.setAttribute('id', 'test');
input1.setAttribute('type', 'range');
input1.setAttribute('min', 0);
input1.setAttribute('max', 100);
input1.setAttribute('step', 1);
input1.setAttribute('value', 50);
form.appendChild(input1);
div.appendChild(form);

…我看到滑块已添加到

Framework7

html文件中，但滑块未在页面上呈现（显示）

欢迎任何帮助。谢谢

另外，我尝试了@ii iml0sto1此处提出的方法，但也不起作用

PPS.@Amit Mondal提出的解决方案也不起作用。我猜这是由

Framework7

引起的，所以我更新了我的问题，加入了对该框架的引用

---

PPP。其他类型的输入元素（文本和下拉问题）被正确呈现。

您可以运行下面的代码片段，谢谢，但这不起作用。我想这与我的应用程序有关（混合应用程序的Framework7）。如果我发现问题，我会告诉你；我也会更新我的问题。我希望这能帮你一点忙。谢谢，但不，我看不出framework7 API在这里有什么帮助。你知道吗？（注：我可以呈现文本和其他输入字段，没有任何问题）。

var div = document.getElementById('emptypage');
var form = document.createElement('form');
var input1 = document.createElement('input');
input1.setAttribute('id', 'test');
input1.setAttribute('type', 'range');
input1.setAttribute('min', 0);
input1.setAttribute('max', 100);
input1.setAttribute('step', 1);
input1.setAttribute('value', 50);
form.appendChild(input1);
div.appendChild(form);