Tornado动态初始化HTML SELECT

使用Tornado和jQuery动态初始化HTML SELECT

最新推荐文章于 2022-08-12 14:05:34 发布

原创

最新推荐文章于 2022-08-12 14:05:34 发布 · 401 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#python #jquery

这篇博客介绍如何在Tornado后端查询数据库并利用jQuery的AJAX功能动态初始化HTML SELECT元素，以实现APK升级界面的动态加载。在HTML端，利用window.onload调用JS函数，通过AJAX请求获取Tornado返回的JSON数据，然后更新SELECT选项。

这里要实现一个APK升级的后台服务，需要查询数据库，根据数据库内容来显示升级界面，这就需要使用tornado的数据来初始化HTML的内容。这里借助Jquery的ajax来实现。

HTML端
html使用window.onload来调用js的函数，通过ajax来访问tornado获取相关数据：

        window.onload = function() {
   
   
            var select = document.getElementById("project");
            $.ajax({
   
   
                url:"/version/load",
                type:"GET",
                data:{
   
   project:"none"},
                success:function(arg) {
   
   
                    var obj = jQuery.parseJSON(arg);
                    console.log(obj.version);
                    console.log(obj.projects);
                    if(obj.projects == "none") {
   
   
                        console.log("no project");
                        $("#project2").show();
                        document.getElementById("project2").setAttribute("required", "required");
                    } else {
   
   
                        var projects = obj.projects.split(",");
                        for(var project of projects) {
   
   
                            var option = document.createElement(<