avalon.js数据绑定,动态添加的dom元素,其中绑定的数据解析

avalon.js数据绑定,动态添加的dom元素,其中绑定的数据解析,第1张

楼下说得太简单了,估计提问者看不懂。

假设,你有以下DOM

<div id="dvTest">

    <div>在这下面加一个按钮</div>

</div>

然后你添加一个按钮,方法如下

function addButton(){

    var $container = $("#dvTest")

    $container.append("<a href='javascript:'>click me</a>")

}

然后,给刚加的按钮一个click事件

//你要先找到你加的这个按钮

$("#dvTest > a").click(function(){ alert('you clicked me') })

//或

$("#dvTest > a").unbind().on('click'), function(){ alert('you clicked me') })

我觉得你主要是jQuery的筛选器用得不够熟。你可以搜一下,大概看看。只要能找到控件,绑定事件都不叫事儿。

avalon是通过ms-repeat实现对一组数据的批量输出。这一组数据可以是一个数组,也可以是一个哈希(或叫对象)。我们先从数组说起吧。

第二节就说,凡是定义在VM中的数组,如果没有以$开头或者没放在$skipArray数组里,都会转会监控数组。监控数组其实就是一个被重写了push、unshift、shift、pop、 splice、sort、reverse方法的普通数组。当然它也添加了其他一些方法,如set、 pushArray、remove、removeAt、removeAll、clear、ensure、 contains、size。我们只要 *** 作这些方法就能同步视图。

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=UTF-8">

<script src="avalon.js" ></script>

<script>

var model = avalon.define({

$id: "test",

array: ["aaa","bbb","ccc"]

})

</script>

</head>

<body ms-controller="test">

<ul>

<li ms-repeat="array">{{el}} --- {{$index}}</li>

</ul>

</body>

</html>


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11537368.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-16
下一篇2023-05-16

发表评论

登录后才能评论

评论列表(0条)

    保存