javascript - 在 Backbone View 中添加下拉菜单

标签 javascript jquery html backbone.js

我正在尝试在后骨 View 中添加一个简单的下拉列表(我正在使用 jquery 在我的渲染方法中创建)。我可以看到选项列表(控制台)正在生成,但它没有附加到主#container div。

<html>
    <head>
        <script type="text/javascript" src="jquery-1.11.3.js"></script>
        <script type="text/javascript" src="underscore-min.js"></script>
        <script type="text/javascript" src="backbone.js"></script>      

        <script>
                var DropdownView = Backbone.View.extend({
                    el: "#container",
                    initialize: function() 
                    {
                      this.render();                        
                    },
                    render : function()
                    {
                        var data = ['volvo','mercedes','audi'];                                             
                        var options = $("<select>");                    
                        options.attr({"id" : "drpdwn"});
                        var selectOption = $('<option>').val("select").text('select');
                        options.append(selectOption);

                        _.each(data,function(val){                      
                            var option = $('<option>').val(val).text(val);
                            options.append(option);

                        })      
                        console.log(options);               
                        console.log(this.$el);
                        this.$el.html(options);
                    }
                });

                var view = new DropdownView ();
        </script>   
    </head>
    <body>
        <div id="container">

        </div>  
    </body>
</html>

最佳答案

DropdownView正在 build #container DOM 中不存在。

将您的脚本移动到您的 </body> 之后.

既然你已经在使用 jQuery,你也可以用

$(document).ready()

关于javascript - 在 Backbone View 中添加下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31117518/

相关文章:

循环内的 JavaScript 闭包 – 简单的实际示例

javascript - Node Js - mssql 的 TransactionError (ENOTBEGUN)

javascript - 使用 chrome.tabs.captureVisibleTab 的屏幕截图

javascript - 谷歌浏览器扩展和 Twilio 客户端 API

javascript - Firefox 插件 : XMLHttpRequest minor bug reading JSON

javascript - jQuery 抓取内容并水平滚动页面

javascript - 根据 javascript 中的值重新排列数组并执行 for 循环

javascript - 在 Django 中选择 <select> 元素的默认值

javascript - 如何检测我的搜索栏是否已展开?

javascript - 如何从网站内部下载整个网站