创建包含 SQLite 字段内容的 html 下拉列表

Creating a html dropdown list with the contents of a SQLite field

本文关键字:html 下拉列表 包含 SQLite 字段 创建      更新时间:2023-09-26

我正在尝试使用嵌入式JavaScript使SQLite字段成为html中下拉列表的内容。这是我拥有的代码,但它不起作用。

            <select>
            <option value="default">Select a test to edit</option>
            <script>
            var db = openDatabase('ExamSQL', '1.0', 'database')
            db.transaction(function (tx) {
                tx.executeSql('SELECT Questions FROM Question',[],function(tx,questions);
                {
                    var len = questions.rows.length, i;
                    for (i = 0; i < len; i++) {
                    </script><option value="name"><script>
                        document.write(questions.rows.item(i).text)
                        document.getElementById("name").innerHTML=questions.rows.item(i).text
                    </script></option>
                    <script>
                }
            });
            </script>
        </select>

谁能帮忙?

编辑:我在BrokenBinary的评论之后这样做了

<select id="section_list">
    <option value="default">Select a section the question is in</option>
    <script>
    var db = openDatabase('ExamSQL', '1.0', 'database')
    db.transaction(function (tx) {
        tx.executeSql('SELECT SectionName FROM Section',[],function(tx,sections);
        {   
            var select=document.getElementById('section_list')
            var len = sections.rows.length, i;
            for (i = 0; i < len; i++) {
                var option = document.createElement('option');
                option.text=sections.rows.item(i).text;
                option.value=sections.rows.item(i).text;
                select.appendChild(option);
            }
        }
    });
    </script>
</select>

而且它不起作用。还有什么建议吗?

您不能在循环中间关闭<script>标签。相反,您应该在 javascript 中创建 <option> 元素,然后将其附加到<select>元素中。

所以你的循环看起来像这样:

// Give your select an ID and use it here
var select = document.getElementById('my-select');
var len = questions.rows.length, i;
for (i = 0; i < len; i++) {
    var option = document.createElement('option');
    option.text = questions.rows.item(i).text;
    option.value = questions.rows.item(i).text;
    select.appendChild(option);
}