jsviews中的Helper函数

Helper functions in jsviews

本文关键字：函数 Helper 中的 jsviews      更新时间：2023-09-26

我将在JsViews网站上查看以下示例中的按钮http://www.jsviews.com/#link-button。当我修改代码以获取输入并在单击按钮时在警报框中显示相同的输入时，辅助函数将被onload执行。此外，当输入值发生变化时执行函数，而不是单击按钮。我猜，因为模型值在视图中改变，函数被调用更新的模型值，但为什么它不工作在点击按钮。我对jsviews很陌生，无法理解发生了什么。谁能告诉我我的方法有什么问题吗?以下是更新后的代码:

<div id="topLinked">
<input type="text" data-link="test"/>
 <button data-link="{on ~doSomething(test)}">Do something</button>
<input type="button" data-link="{on ~doSomething(test)}" value="Do something" />
           </div>  
  var person = {};
var helpers = {
  doSomething: function(val) {
    alert(val);
  }
}
$.link(true, "#topLinked", person, helpers); // Data-link top-level content

你犯了一个错误:data-link="{on ~doSomething(test)}"。参数通过一个或多个空格传递，如:data-link="{on ~doSomething test test2 ...}" .

我把这个例子改成这样:

<div id="result"></div>
<script id="tmpl" type="text/x-jsrender">
  <input type="text" data-link="test" value="Do something" />
  {^{on ~doSomething test}}Do something{{/on}}
  <button data-link="{on ~doSomething test}">Do something</button>
  <input type="button" data-link="{on ~doSomething test}" value="Do something" />
</script>

js 

var person = {
    test : "start value"
};
var helpers = {
    doSomething : function (val) {
        alert(val);
        return false;
    }
}
var tmpl = $.templates("#tmpl");
tmpl.link("#result", person, helpers);

关于jsfiddle的例子

相关文章：