JQ:

 <div class="wrap">
<textarea></textarea>
<div class="miss"></div>
</div>
 $('textarea').on('input propertychange', function() {
$('.miss').html($(this).val().length + "~"+$(this).val());
});

JS:

 var txt = document.querySelector("textarea"),
msg = document.querySelector(".miss");
//不兼容IE8 以下
txt.addEventListener("input",function () {
msg.innerHTML = this.value + "~"+this.value.length;
},false)

jq,js简单实现类似Angular.js数据绑定效果的更多相关文章

  1. Angular-chart.js 使用说明(基于angular.js工程)

    Angular-chart.js是基于Chart.js的angular组件,引入项目后直接操作数据即可. 引用方法:    分别将Chart.js.angular-chart.js.angular-c ...

  2. 关于Iscroll.js 的滑动和Angular.js路由冲突问题

    Iscroll主要应用于app移动端开发. 主要代码: window.onload=function(){ var myIscroll=new IScroll(".headerNav&quo ...

  3. jq demo 简单的图片懒加载效果

    重点:在元素进入可视区域后,把图片元素的 _src 的值,赋值给 src <!DOCTYPE HTML> <html> <head> <meta http-e ...

  4. Angular JS - 3 - Angular JS 双向数据绑定

    一 .数据绑定 1. 数据绑定: 数据从一个地方A转移(传递)到另一个地方B, 而且这个操作由框架来完成2. 双向数据绑定: 数据可以从View(视图层)流向Model(模型,也就是数据), 也可以从 ...

  5. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  6. Angular.js vs Ember.js

    Angular.js 拥抱 HTML/CSS Misko Hevery(Angular.js的开发者之一)回答了这一问题,他的主要观点如下: 在HTML中加入太多逻辑不是好做法.Angular.js只 ...

  7. 推荐 15 个 Angular.js 应用扩展指令(参考应用)

    几天前我们看到Angular 1.4.0发布了-一个以社团为驱动的发布版本涵盖了400多个GitHub的提交,增加了对特性的提升,比如动画,以及可用性. 官方新闻发布稿 覆盖了绝大部分,这同样值得放于 ...

  8. angular.js之作用域scope'@','=','&'

    <!doctype html> <html ng-app='myApp'> <head> </head> <body> <script ...

  9. angular.js 动态插入删除dom节点

    angular.js 是新一代web开发框架,它轻松在web前端实现了MVC模式,相比 jquery 模式,这种新玩意竟然不需要开发者直接去操作dom . 作为前端开发而不去操作dom ,这简直是一个 ...

随机推荐

  1. Lyx输入中文与代码高亮

    如果您看了我的这个随笔:<OpenSUSE 13.2安装Texlive2014+Texmaker+Lyx> (一)LyX中文 打开Lyx直接新建开始使用,那么输入的中文会是编译失败的,疑? ...

  2. 四种方案:将OpenStack私有云部署到Hadoop MapReduce环境中

    摘要:OpenStack与Hadoop被誉为继Linux之后最有可能获得巨大成功的开源项目.这二者如何结合成为更猛的新方案?业内给出两种答案:Hadoop跑在OpenStack上或OpenStack部 ...

  3. solr中重跑索引

    solr与.net系列课程(八)solr中重跑索引的注意事项   solr与.net系列课程(八)solr中重跑索引的注意事项 我们如果在项目中使用solr,那肯定就是把数据库中的数据跑进solr服务 ...

  4. 使用winform控件注意线程绘制界面冲突

    在用.NET Framework框架的WinForm构建GUI程序界面时,如果要在控件的事件响应函数中改变控件的状态,例如:某个按钮上的文本原先叫“打开”,单击之后按钮上的文本显示“关闭”,初学者往往 ...

  5. .NET MVC4 实训记录之四(Unit of work + Repository)

    今日后开启进阶模式! 谈到MVC与EntityFramework,则不得不说一说事务与仓储(Unit of work + Repository). 仓储(Repository):领域对象集合.用于操作 ...

  6. 使用Strust2框架写HelloWorld

    使用Strust2框架写HelloWorld 一.创建JavaWeb项目 二.搭建Stust2 FrameWork开发环境 三步完成Struts2 FrameWork开发环境的搭建 1.加入搭建Str ...

  7. 写入与导出excel

    检索 COM 类工厂中 CLSID 为 {00024500-0000-0000-C000-000000000046} 的组件失败,原因是出现以下错误: 80070005 拒绝访问. (异常来自 HRE ...

  8. 【转】在iOS开发中使用FMDB

    本文转载自:唐巧的博客 在iOS开发中使用FMDB APR 22ND, 2012 前言 SQLite (http://www.sqlite.org/docs.html) 是一个轻量级的关系数据库.iO ...

  9. 企业架构研究总结(41)——企业架构与建模之ArchiMate的由来和详述(上)

    终于完成了关于企业架构框架理论的总结,谢谢各位看官的支持,能挺过之前过于理论化的叙述而坚持到现在着实不易,笔者也自愧没有实践经验可以分享,希望日后有兴趣的看官能够不吝赐教.在本系列后面的也是最后一个大 ...

  10. .NET接口和类 反射的差异性发现

    1 背景 在项目中使用反射,反射出某类型的所有属性(Property)和对应的属性值.起初为了性能考虑在模块首次加载就反射类型的所有属性并将其存入字典.根据一般的编程规范——基于接口编程,所以首次传入 ...