精华内容
下载资源
问答
  • KNOCKOUT

    2019-10-24 16:41:07
    KNOCKOUT
  • knockout

    2021-03-25 10:55:32
    text bindding <div id="sample1"> <span data-bind="text:textVal"></span> </div> <script>... ko.applyBindings(sample1,document.getElementById("sample1")) ...text

    text bindding

    <div id="sample1">
    	<span data-bind="text:textVal"></span>
    </div>
    
    <script>
    	var sample1={
    		textVal : ko.observable("aaaa")
    	}
    	ko.applyBindings(sample1,document.getElementById("sample1"))
    </script>
    

    text bindding与HTML bindding区别

    与web一样,text浏览器解析时,不会解析标签
    html会解析标签,会web的会想到,input标签对应的是data-bind=“value:InputValue”

    展开全文
  • Knockout

    2016-12-09 16:08:00
    因为网上教程太少了,但是客户需要用knockout框架,还是不得不去找,根据网上的来源做了简单的Demo,其实就加了点注释 Demo1: <!DOCTYPE html> <meta charset="utf-8"></meta> <title>ko1 ...

    参考:http://www.cnblogs.com/TomXu/archive/2011/11/21/2257154.html

    因为网上教程太少了,但是客户需要用knockout框架,还是不得不去找,根据网上的来源做了简单的Demo,其实就加了点注释

    Demo1:

    <!DOCTYPE html>
    <html lang="en">
    	<head>
    		<meta charset="utf-8"></meta>
    		<title>ko1</title>
    		<script src="jquery-1.10.2.min.js" type="text/javascript"></script>
    		<script src="knockout-3.3.0.js" type="text/javascript"></script>
    		<script src="knockout.validation.min.js" type="text/javascript"></script>
    	</head>
    	<body>
    		<!-- 显示ViewModel的View -->
    		<div>
    			<p data-bind="text: firstName"></p>
    			<p data-bind="text: lastName"></p>
    			<input data-bind="value: firstName"/>
    			<input data-bind="value: lastName"/>
    		</div>
    		<script>
    			//定义ViewModel
    			var ViewModel = function () {
    				this.firstName = "吃兔纸";
    				this.lastName = "不吐毛";
    			}
    			//applyBindings()一定要放最后面,不然无效
    			//绑定ViewModel
    			ko.applyBindings(ViewModel);
    		</script>
    	</body>
    </html>

     Demo2:

    <!DOCTYPE html>
    <html lang="en">
    	<head>
    		<meta charset="utf-8"></meta>
    		<title>ko2</title>
    		<script type="text/javascript" src="knockout-3.3.0.js">
    			//首先导入knockoutjs框架
    		</script>
    	</head>
    	<body>
    		<!-- 显示ViewModel的View -->
    		<h3>午餐时间</h3>
    		<p>菜单: 
    		<select data-bind="options: availableMeals,
    							optionsText: 'mealName',
    							value: chosenMeal">
    		</select>
    		<!-- 通过ko.observable()把值显示在页面 -->
    		<p>
    			你已选择:
    			<b data-bind="text: chosenMeal().description"></b>
    			(价格: <span data-bind='text: chosenMeal().extraCost'></span>)
    		</p>
    		
    		<!-- 因为applyBindings()绑定的时候需要在最后面 -->
    		<script>
    			//定义ViewModel
    			//使用KO的时候,通常说是向服务器调用Ajax读写这个存储的模型数据
    			var availableMeals = [
    				{ mealName: '标准餐', description: '干面包皮', extraCost: 0 },
    				{ mealName: '优质餐', description: '新鲜芝士面包', extraCost: 9.95 },
    				{ mealName: '豪华餐', description: '牛排和葡萄酒', extraCost: 18.50 }
    			];
    			
    			//var viewModel = {
    				//chosenMeal: ko.observable(availableMeals[0])
    			//};
    			
    			//ko.applyBindings(viewModel); 
    			
    			function viewModel() {
    				//可以监控(observe)属性的值并且回应它的变化
    				this.chosenMeal = ko.observable(availableMeals[0])
    			}
    
    			ko.applyBindings(new viewModel()); 
    			
    			//applyBindings()一定要放最后面,不然无效
    			//绑定ViewModel
    			//不知道为什么绑定一个空函数也可以使用availableMeals[]的数据
    			//激活knockout
    			//ko.applyBindings(availableMeals);
    		</script>
    	</body>
    </html>

     Demo3:

    <!DOCTYPE html>
    <html lang="en">
    	<head>
    		<meta charset="utf-8"></meta>
    		<title>ko5</title>
    		<script type="text/javascript" src="jquery.validate.min.js"></script>
    		<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
    		<script type="text/javascript" src="knockout.validation.min.js"></script>
    		<script type="text/javascript" src="knockout-3.3.0.js"></script>
    	</head>
    	<body>
    		<p>First name: <input data-bind="value: firstName"/></p>
    		<p>Last name: <input data-bind="value: lastName"/></p>
    		<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
    
    		<script type="text/javascript">
    			var viewModel = {
    				firstName: ko.observable("吃兔纸"),
    				lastName: ko.observable("不吐毛")
    			};
    
    			//dependentObservable()依赖监控属性
    			viewModel.fullName = ko.dependentObservable(function () {
    				return viewModel.firstName() + " " + viewModel.lastName();
    			});
    
    			ko.applyBindings(viewModel);
    		</script>
    	</body>
    </html>

    转载于:https://my.oschina.net/NamiZone/blog/803152

    展开全文
  • knockOut

    2013-02-04 16:35:00
    http://www.codeproject.com/Articles/336308/TaskTracker-Offline-Web-Application-for-Mobile-usi http://www.codeproject.com/Articles/409247/Knockoutjs-grid-with-Asp-net 转载于:...

    http://www.codeproject.com/Articles/336308/TaskTracker-Offline-Web-Application-for-Mobile-usi

     

    http://www.codeproject.com/Articles/409247/Knockoutjs-grid-with-Asp-net

    转载于:https://www.cnblogs.com/rayrayray/archive/2013/02/04/2892001.html

    展开全文
  • Knockout系类字体

    2017-03-27 17:13:33
    Knockout
  • Knockout用法

    2017-10-26 17:27:21
    Knockout用法,读书笔记,总结了大部分Knockout的技术要点和用法,仅供学习。
  • knockout示例

    2015-05-22 15:33:25
    knockoutknockout.mapping 和knockout.validation联合使用
  • bower install knockout-validation --save NuGet PM > Install-Package Knockout.Validation NPM npm install knockout.validation --save CDN cdnjs ...
  • Knockout介绍 Knockout简称ko,是一个轻量级的javascript类库,采用MVVM设计模式(即Model、view、viewModel),简单优雅的实现了双向绑定,实时更新,帮助您使用干净的数据模型来创建丰富的、响应式的用户界面。 ...
  • knockout简介

    千次阅读 2019-04-23 23:03:54
    knockout简介

    前言

    这一段时间,公司要完善一些代码,有幸接触到了knockout,knockout框架(以下简称KO)是微软推出的一款MVVM的框架,一说起微软就会联想起万恶的IE系列,对于开发人员来说是折磨的,当然,KO是微软的儿子,自然而然的选择了要跟大家和谐相处,所以,KO最低可以兼容到IE6。
    讲述的目的是能够让大家明白使用方法,所以追求极简代码。
    #为什么使用MVVM框架
    相信刚入这一行不久的部分开发人员都很郁闷,为什么要使用框架,对于我个人而言,我认为每有一个框架都要学习,这个代价不如自己进行开发。当然,在此之前我没有开发过大一些的系统或是应用,直到接触到了这些以后,才会明白。
    我个人的思想,使用一款框架之前需要给自己做一个假设,我为什么要使用这个框架,框架是否能够帮助我简化开发,也就是我们需要很了解框架的构成,这一点很重要。当然了,这个想法不适用于初学者或者是老手,适用于了解一部分框架而囫囵吞枣使用的人,不能否认,我不喜欢学习框架 。! - - !

    knockout到底是很么

    前面提到了KO是一款MVVM框架,如今MVVM框架也已经很是盛行了,例如angular、react、vue等等。我头一次接触ko的时,其实不明白什么是MVVM框架,所以,在这里我想稍微借鉴百度说一下什么是MVVM框架。
    MVVM是Model-View-ViewModel的简写,是MVC框架的改进版,MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。
    百度百科MVVM传送门

    就KO框架来说,M - V - VM表现为:

    <!--  VM 真正的核心,数据层向视图层的过程,ko已经帮助你封装好了 -->
    <script type="text/javascript" src="konckout-3.5.0.min.js"></script>
     <!-- 这就是 V 层的表现 -->
    <body>
    	<div data-bind="text: name"></div>
    	<div data-bind="text: age"></div>
    </body>
    <!-- 这就是 M 层的表现,当然没有连接数据库,自定义数据 -->
    <script>
    	var data = [{ name: '张三', age: '18' }]
    	var viewModel = {
    		name: ko.observable('张三'),
    		age: ko.observable('18')
    	}
    	ko.applyBindings(viewModel);
    	
    	viewModel.name(data[0].name).age(data[0].age);
    </script>
    

    我们直白一点,从上述页面的描述中可以看出,ko框架所做的工作就是将DATA数据DOM元素搭上关系,能够由数据直接操控页面的行为,这样方便开发人员能够专注于数据处理,而对于DOM操作则交给了ko框架,简化了开发

    knockout的使用

    我们之前了解到ko所做的工作,现在我们来聊聊它的使用。如同所有代码一样,想要使用ko,就需要对其进行入口配置,

    ko.applyBindings(viewModel) && ko.applyBindings(new viewModel())
    

    可以看出ko可以接收两种值,对象和函数

    var viewModel = {
        name: ko.observable('张三'),
    	age: ko.observable('18')
    }
    &&
    var viewModel = function(){
        this.name = ko.observable('张三');
        this.age = ko.observable('18');
    }
    

    在这里我们可以看出,对象(方法)的目的是为了将数据输出

        <div data-bind="text: name"></div>
    	<div data-bind="text: age"></div>
    

    最后,我们进行数据的绑定。
    有一点值得一提,大多数MVVM框架的绑定绑定分为 none/one-way/two-way,而ko并没有one-way(单向绑定),所有的绑定都是双向绑定。

    展开全文
  • 敲除结合 Knockout 绑定的集合
  • knockout2.0

    2014-06-15 13:14:14
    knockout2.0 汉化版抠图软件。
  • 淘汰赛例子 学习knockout.js
  • Knockout代码

    2015-03-29 13:49:54
    Knockout是开源的UI与数据模型绑定的框架,实现MVVM模式,这是很好的示例代码!
  • Hello_KnockOut 概述 我尝试了 KnockOut.js 的 描述 我复制了 KnockOut.js 教程 。 如何使用 由于 KnockOut.js 本身在 js 文件夹中,您可以通过修复 Html 中的链接立即尝试。
  • knockout js

    2012-08-05 10:33:04
    knockout javascript 最全的参考文档
  • Knockout Validation

    千次阅读 2015-09-06 16:26:16
    Knockout 将View与Data进行双向绑定,在View上的数据改变能够自动反映到View所绑定的数据源上,同理,数据源的改变也能够立即反映到相关的View上。我们在使用Knockout的时候,还需要做的一个事情就是数据校验,在这...
  • Knockout-BindingHandlers Knockout.js 的一些库绑定处理程序
  • #Knockout Parsley 用于 Knockout JS 的验证。 许可证: ##用法 // Init the plugin ko . parsley . init ( '#main-form' ) ; var viewModel = { // Add a simple rule to the observable value1 : ko . ...
  • 深入学习 Knockout.JS

    2021-03-24 13:50:21
    Diving into Knockout.JS
  • knockout-3.4.2下载

    2018-01-26 13:54:35
    knockout-3.4.2下载 一直研究knockout有兴趣的朋友一起
  • Knockout Virtual Grid 是一个 Knockout 组件,用于通过单元虚拟化处理表格中的大量数据。 为了让表格提供“本机”表格外观(用于箭头键导航和编辑),它使用了 。 演示 (通过 JSBin - 单击“在 JSBin 中编辑”...
  • Knockout.observableSet Knockout JS的Observable Set对象。 灵感来自 如何使用 该库需要支持JavaScript Set对象的浏览器。 (有关更多信息,请参见和) [removed][removed] [removed][removed] 以下示例代码基于 ...
  • knockout帮助文档

    2015-05-18 17:41:45
    knockout的帮助文源档,有pdf和chm的,绝对适合学习knockout

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 8,500
精华内容 3,400
关键字:

knockout