帮助器在jsviews中起作用

时间:2016-09-07 07:49:19

标签: javascript jquery jsrender jsviews

我将在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

1 个答案:

答案 0 :(得分:1)

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

我改变了example,就像这样:

<强> HTML

<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