标签: javascript-framework

当焦点在"里面"时,如何改变元素/容器的样式呢?

假设有这样的代码:

<div class="notSelected">
      <label>Name
          <input type="text" name="name" id="name" />
      </label> 
      <div class="description">
          Tell us what's your name to make us able to fake to be your friend 
          when sending you an email.
      </div>
</div>
Run Code Online (Sandbox Code Playgroud)

现在假设我对表单的每个元素都有类似的东西(这只是一个例子).在以下情况下,我想将样式从notSelected更改为Selected:

  • 用户专注于输入元素
  • 用户将鼠标移到notSelected div上

当他改变焦点时,所选的div应该再次被选中.

我想做这样的事情来增加所选div文本的大小.无论如何,做其他更改也很酷,所以我更喜欢更改class属性.

在JavaScript中执行此类操作的最佳方法是什么?是否有任何JavaScript框架可以促使我做这件事?因此,添加褪色等效果会很容易...

我下载了MooTools,但是快速阅读文档,我没有看到如何在没有任何表格div的特定ID的情况下执行此操作,但这是我第一次使用它.我没有使用任何其他框架的问题,但如果你建议一个,请写下我应该具体寻找什么.

javascript javascript-framework

1
推荐指数
2
解决办法
3164
查看次数

mootools:我如何在一个页面中放置10,000个<div>标签

我在mootools开发了一个应用程序.但它包含的标签数量很少,几乎是10,000.每个标签的结构如下:

<div style="float:left;padding:5px;margin: 6px;"> <!-- tag-1 -->
 <img src=""> <p>name</p> <p>Gender</p> <p>Mood</p> 
</div>
Run Code Online (Sandbox Code Playgroud)

在以下容器中

<div id="tags_container" style="overflow: scroll;height: 700px;">
 <div style="float:left;padding:5px;margin: 6px;"> <!-- tag-1 -->
  <img src=""> <p>name</p> <p>Gender</p> <p>Mood</p> 
 </div>
 <!-- tag-2 -->
   .  
   .
   .
 <!-- all tags one after another -->
</div>
Run Code Online (Sandbox Code Playgroud)

我以行和列格式显示这些标签(5列和2000行).id ="tags_container"<div>具有垂直滚动条.但当我尝试向下滚动该分区以查看更多标签时,它滚动的速度很慢.

我该怎么办呢?

我应该将实现方法从<div>标签更改为<table>标签吗?

有什么选择让它更快?

在之前的几个问题中,我被建议不要在一个单独的文档中使用那么多标签,但是会有那么多标签,所以我该怎么办呢.

javascript mootools javascript-framework

1
推荐指数
1
解决办法
349
查看次数

PMT功能支付类型

下面是我计算贷款还款额的函数,就像在Excel中一样,我需要添加另一个参数即付款类型。

function PMT (ir, np, pv, fv ) {
 /*
 ir - interest rate per month
 np - number of periods (months)
 pv - present value
 fv - future value (residual value)
 type - 0 or 1 need to implement that
 */
 pmt = ( ir * ( pv * Math.pow ( (ir+1), np ) + fv ) ) / ( ( ir + 1 ) * ( Math.pow ( (ir+1), np) -1 ) );
 return pmt;
}
Run Code Online (Sandbox Code Playgroud)

在类型= 0的情况下,将计算1个月的利息,因为假定付款在月底。对于Type …

javascript c# vb.net javascript-framework

1
推荐指数
1
解决办法
6896
查看次数

在Knockout.js中,如何在映射后基于复选框字段对viewModel项进行排序

数据示例,其中VoucherRedeemed是一个checkbox值:

{
 VoucherTitle: "title 2",
 VoucherRedeemed: false,
},{
 VoucherTitle: "title 4",
 VoucherRedeemed: true,
},{
 VoucherTitle: "title 6",
 VoucherRedeemed: false,
},{
 VoucherTitle: "title 9",
 VoucherRedeemed: true,
}
Run Code Online (Sandbox Code Playgroud)

在映射之后,如何根据复选框值对viewModel.voucher进行排序:

viewModel.voucher = ko.mapping.fromJS(voucherData.voucher)
Run Code Online (Sandbox Code Playgroud)

我已经看过对可观察数组进行排序,但没有设法与复选框值排序的映射方案相关联.(http://knockoutjs.com/documentation/observableArrays.html)

任何关于如何在ko.mapping.fromJS之后对数组进行排序的示例将不胜感激!

javascript javascript-framework knockout.js

1
推荐指数
1
解决办法
4882
查看次数

Backbone Collection不会填充

我是一名初学者,并且在设置一个非常基本的虚拟示例工作时遇到了麻烦.我确定这是一个愚蠢的错误的结果,但我会感激任何指导.

这是我的javascript:

var lr = lr || {};

lr.Event = Backbone.Model.extend({});

lr.Events = Backbone.Collection.extend({
  model: lr.Event,
  url: '/json/dummy.json'
});

lr.EventView = Backbone.View.extend({
  tagName: 'div',
  initialize: function() {
    _.bindAll(this, "render");
    this.collection = new lr.Events();
    this.collection.fetch();
    console.log(this.collection.toJSON());
    this.render();
  },
  render: function() {
  } 
});

lr.ev = new lr.EventView();
Run Code Online (Sandbox Code Playgroud)

这是json/dummy.json:

[
  { "title": "Event1", "Location": "New York, NY" },
  { "title": "Event2", "Location": "Cleveland, OH" }
]
Run Code Online (Sandbox Code Playgroud)

我希望这可以在console.log中使用JSON,但它取而代之的是console.log是一个空数组.我究竟做错了什么?

javascript javascript-framework backbone.js

1
推荐指数
1
解决办法
575
查看次数

无法让Ember.js从控制器中的对象渲染属性

总Noob问题在这里.我为简单而道歉,我在这里浏览了数百个Ember标记的帖子,寻找答案.但是,对于任何人来说,似乎都太过于原始,以至于不得不烦恼...

我是从头开始和Ember一起开始的.我做了Andy Matthews的EmberTweets教程,它运行良好.我正在尝试使用它作为我的第一个Ember应用程序的基础,这非常简单; 但我坚持最基本的步骤.我似乎有一个正常运行的控制器,我似乎成功地添加了新的对象.但我无法为我的生活获取我的视图来渲染这些对象的属性.基本视图呈现出来,但不是来自控制器的数据,我只是想通过一个简单的方法来访问它#each.我在任何浏览器控制台都没有错误.

小提琴就在这里.

我试过在我的例子中以三种不同的方式向控制器添加对象,看看是否有帮助.我可以通过检查内容数组,或者像FilterMenus.MenusController.content.objectAt(2).get('menu_name')这样,从控制台成功访问对象的属性.显然,数据是正确的.

但是当我尝试渲染任何属性时,我的模板中仍然没有出现任何内容,例如:{{menu_name}}.我做错了什么,拜托?

javascript-framework ember.js

1
推荐指数
1
解决办法
1098
查看次数

angularJS docs中的各种术语是什么意思?

(这里给出的API参考:http://docs.angularjs.org/api分为几个模块.每个模块都有它的指令集,服务,过滤器.

我想知道这些术语(即指令,服务,模块等)的含义以及它们在使用angularJS制作的典型网络应用程序中扮演的角色什么

javascript rest web-applications javascript-framework angularjs

1
推荐指数
1
解决办法
2203
查看次数

与其他框架相比,javascript/UI EXTJS与HTML 5的最佳框架

我们有一个基于flex框架的应用程序构建,它具有相当华丽的外观和感觉功能,由于闪存的先决条件,用户希望有一个备用框架,它没有客户端机器依赖性.

该应用程序是在ExtJS 3.3上新建的,它还享有华而不实的外观和感觉功能,但很快我们就遇到了性能和自定义ExtJS应用程序行为的问题.

现在我们真的想继续使用现有的ExtJS应用程序,或者从纯粹的html,dhtml,HTML5等开始构建应用程序,我们可以通过性能自定义组件.

请分享一下最适合的框架

1.性能2.Customization灵活性3.维护

编辑1#经过大量的研究,会见正在研究各种JavaScript框架的人,并研究真正的情景,其中差异实际上出现在图片中,下面是我的研究

ExtJS

1.  ExtJS (The latest version) is a MVC based framework based on Yahoo YUI, it supports the     concepts of MVC in JavaScript and is a well tiered framework with good extendibility and support.
2.  ExtJS has good documentation and active forums.
3.  It comes in both paid and free version , offers paid support also.
4.  ExtJS 4.x has got a major revamp from design perspective and improved in terms of performance …
Run Code Online (Sandbox Code Playgroud)

html javascript html5 extjs javascript-framework

1
推荐指数
1
解决办法
7902
查看次数

我无法理解jQuery链是如何工作的

我无法理解jQuery链是如何工作的.

jQuery("div").attr("id", "_id")
    .hide()
    .show();
Run Code Online (Sandbox Code Playgroud)

我做了类似链接的事情,但我不确定它是否与jQuery使用的逻辑相同.

var fun = (function (parma) {
return function () {
    return {
        start: function () {
            console.log("start");
            return this;
        },

        mid: function () {
            console.log("mid");
            return this;
        },

        last: function () {
            console.log("last");
            return this;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

})();

// Working
fun().start()
    .mid()
    .last();
Run Code Online (Sandbox Code Playgroud)

javascript jquery unobtrusive-javascript javascript-framework

1
推荐指数
1
解决办法
433
查看次数

这个Angular 2应用程序中的服务层次结构究竟如何工作?

我是Angular 2的新手,我有关于服务的以下问题.

进入主视图(与app.component.ts类相关的一个)我遇到这种情况:

<div class="container">
  <div class="row">
    <div class="col-xs-12 col-md-8 col-md-offset-2">
      <app-new-account (accountAdded)="onAccountAdded($event)"></app-new-account>
      <hr>
      <app-account
        *ngFor="let acc of accounts; let i = index"
        [account]="acc"
        [id]="i"
        (statusChanged)="onStatusChanged($event)"></app-account>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

所以在这个视图中我有2个子组件(app-new-accountapp-account).

进入主AppComponent组件类我有:

import {Component, OnInit} from '@angular/core';
import {AccountsService} from './accounts.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [AccountsService]
})
export class AppComponent implements OnInit {

  accounts: {name: string, status: string}[] = [];

  // Injectiong the …
Run Code Online (Sandbox Code Playgroud)

javascript javascript-framework angular2-services angular

1
推荐指数
1
解决办法
221
查看次数