Question

我想基于CLICK操作更改DIV类。我正在尝试制作一个像http://startbootstrap.com/templates/simple-sidebar.html

这样的浮动侧边栏

这个演示只有三行代码用于切换类。

<script>
    $("#menu-toggle").click(function(e) {
        e.preventDefault();
        $("#wrapper").toggleClass("active");
    });
    </script>

我希望以同样的方式实现同样的目标。以下是我的HTML代码：

<div id="wrap">
    <div class="pull-left" id="main_menu">
    <ul class="list-group">
        <li class="list-group-item">{{#link-to "selectImage"}}<h4>Choose Picture</h4>{{/link-to}}</li>
        <li class="list-group-item">{{#link-to "message"}}<h4>Write Message</h4>{{/link-to}}</li>
        <li class="list-group-item"><a href="#"><h4>Account info</h4></a></li>
        <li class="list-group-item"><a href="#"><h4>Recent Orders</h4></a></li>
        <li class="list-group-item"><a href="#"><h4>How to</a></h4></li>
        <li class="list-group-item"><a href="#"><h4>FAQ</a></h4></li>
    </ul>
    </div>
    <!-- Begin page content -->
        <div class="container" id="page_content">
            {{outlet}}
        </div>
    <!-- End page content -->
    </div>
</script>

<script type="text/x-handlebars" id="cards/index">
        <h1>
        <button class="pull-left btn btn-default" data-target="#main_menu" {{action 'changeClass'}}>
           <img src="images/icons/menu_tablet.png" class="main_menu"/>
        </button>
</script>

现在我不知道如何使用该操作来更改WRAP div中的类。对于这个问题我真的很感激。

Answer 1

您可以在控制器中为cards / index

添加动作处理程序

Controller = Ember.ObjectController.extend({
  actions: {
    changeClass: function() {
     // Run logic here
    }
   }
})

单击操作Ember上更改DIV类

1 个答案: