如何在通过knockout数据绑定的DOM元素上添加事件
通过knockout数据绑定的DOM元素,通过chrome控制台打断点知道,DOM元素会被暂时隐藏,使用document.querySelector()是获取不到的,会显示null,直到数据绑定完成才会出现。如果要在这些DOM元素上面绑定事件,必须再数据绑定完成之后添加事件,而且绑定事件和数据绑定的代码必须写在同一个作用域里。不然添加绑定事件不会成功。
案例 一段AJAX调用成功后绑定数据,并且添加事件的代码(ajax已被封装)
var ViewModel = {
availableCashData: ko.observable(),
assetInfoByCodeData: ko.observable()
}
ko.applyBindings(ViewModel);
function getAssetInfoByCode() {
var dataParams = {
"MethodAlias": "App_GetAssetInfoByCode",
"Parameter": [windcode]
};
ajaxRequest(ajaxUrl, dataParams, function(data) {
if(data && data.State == 0 && data.Data) {
var assetInfoByCode = data.Data;
ViewModel.assetInfoByCodeData(assetInfoByCode);
//点击基金名称重新搜索功能
var fundNameChange = document.querySelector(".fundname-change");
fundNameChange.addEventListener("tap", function() {
gotoUrlWebView('search_page.html?id=' + competitionId+'&origin='+originPage);
});
}
})
};
getAssetInfoByCode();
如何在通过knockout数据绑定的DOM元素上添加事件的更多相关文章
- JavaScript Dom基础-9-Dom查找方法; 设置DOM元素的样式; innerHTML属性的应用; className属性的应用; DOM元素上添加删除获取属性;
JavaScript Dom基础 学习目标 1.掌握基本的Dom查找方法 domcument.getElementById() Domcument.getElementBy TagName() 2.掌 ...
- dom元素上添加断点(使用dom breakpoint找到修改属性的javascript代码)
使用dom breakpoint能快速找到修改了某一个dom element的JavaScript code位于何处.在Chrome development tool里,选中想要inspect的dom ...
- JS闭包机制实现为DOM元素循环添加事件
HTML代码: <button type='button' class='btn' id='1'>按钮1</button> <button type='button' c ...
- 【jquery】 在异步加载的元素上绑定事件
最近因为工作关系又重新回归到了jquery的怀抱,发现很多jquery的一些细节处理的部分都忘记了.这里记录一下最近在做项目时频繁遇到的一个问题:给异步加载的元素添加事件绑定. 问题发生的前提是项目前 ...
- event.target 属性返回哪个 DOM 元素触发了事件。
<ul> <li>list <strong>item 1</strong></li> <li><span>list ...
- 在元素上写事件和addEventListent()的区别
在元素上写事件和addEventListent()的区别1. onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的.而addEventListener能添加多个事件绑定,按顺序执行.2. a ...
- Jquery 在动态元素上绑定事件
弄了很久却没有弄出来,感觉没有错,但是动态元素上的事件根本就不响应,代码如下: <input type="button" id="btnyes" valu ...
- jQuery查看dom元素上绑定的事件列表
jQuery API提供了一种能够查看元素已绑定事件的列表,这个功能在进行功能调试的时候特别有用,尤其确定在代码执行过程中元素绑定的事件是否被更改. 1: jQuery( elem ).dat ...
- ajax获取的数据如何渲染到dom元素上
1.常见的字符串拼接 (对于动态创建的元素添加js时,使用事件委托,利用事件冒泡的原理,把事件添加到父级元素上,触发执行效果) $("ul").on('click','li',fu ...
随机推荐
- ZooKeeper分布式锁浅谈(一)
一.概述 清明节的时候写了一篇分布式锁概述,里面介绍了分布式锁实现的几种方式,其实那时候我一直沉迷于使用redis的悲观锁和乐观锁来实现分布式锁,直到一个血案的引发才让我重新认识了redis分布式锁的 ...
- 一天搞定CSS:文本text--05
1.文本体系 2.文本各属性取值 说明: 每一个属性后面的分支是属性值,以及对属性值的说明. 比如text-align- - - -有3个取值:left,center,right 3.空格大小 4.代 ...
- 在ie下,a标签包被img的时候,为什么有个蓝色的边线
效果像下图这样 那是由于<img>在ie下有默认边框,只要清除边框就可以了,在style中定义 img{ border:none } 显示效果就变成下面这样了 完!
- 前端css要加的一些
编码格式 @charset "utf-8"; body的外边距设置 margin:0; 标签设置 form,ul,ol,li设置为padding:0; ul,ol,li设置为lis ...
- shiro开发,shiro的环境配置(基于spring+springMVC+redis)
特别感谢lhacker分享的文章,对我帮助很大 http://www.aiuxian.com/article/p-1913280.html 基本的知识就不在这里讲了,在实战中体会shiro的整体设计理 ...
- Unity3d—做一个年月日选择器(Scroll Rect拖动效果优化)— 无限滚动 + 锁定元素
最近..... 废话不多说上效果图 用的是UGUI 我先说思路 通过判断元素的位置信息来改变Hierarchy的顺序 实现无限滚动 改变位置的同时也要不断的调整Content的位置防止乱跳 元素锁定就 ...
- Swift 了解(1)
Apple取消了oc的指针以及其他不安全的访问的使用,舍弃的smalltalk语法,全面改为点语法,提供了类似java的命名空间 范型 重载: 首先我们了解一下Swift这门语言.Swift就像C语言 ...
- 从deque到std::stack,std::queue,再到iOS 中NSArray(CFArray)
从deque到std::stack,std::queue,再到iOS 中NSArray(CFArray) deque deque双端队列,分段连续空间数据结构,由中控的map(与其说map,不如说是数 ...
- [codeforces113D]Museum
D. Museum time limit per test: 2 seconds memory limit per test: 256 megabytes input: standard input ...
- 每天一个JS 小demo之树菜单。主要知识点:DOM方法综合运用,递归运用
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...