Kendo 元素中的模板 onClick 不起作用

Kendo Template onClick in element does not work

<script type="text/x-kendo-template" id="logotemplate">
    <div >
        <h3>#: name#</h3>
         # for (var i=0; i< options.length;i++) { #
             <img src="#= options[i].url #" class="item-photologos" onclick="clickedImage(name,i)"   />
         # } #
    </div>
</script>

我有一个自定义 Kendo 移动列表视图模板。图像按预期显示,但没有触发 onclick,日志中也没有错误。我在 onclick 方法周围尝试了许多不同的 #: #、##、#= # 等组合,但不起作用(在某些情况下,我看到错误消息,如 "i is not defined")。帮助将不胜感激。

我想你想要这样的东西

<script type="text/x-kendo-template" id="logotemplate">
<div >
    <h3>Blah</h3>
    # for (var i=0; i< options.length;i++) { #
    <img src="#= options[i].url#" class="item-photologos" onclick="clickedImage('#: options[i].name #' , #:i #)"   />
    # } #
</div>

clickedImage里面的参数是传入的,不是硬编码的字符串。

这会呈现以下内容:

   <div>
    <h3>Blah</h3>
    <img src="foo.jpg" class="item-photologos" onclick="clickedImage('Jane Doe' , 0)"   />
    <img src="bar.jpg" class="item-photologos" onclick="clickedImage('John Doe' , 1)"   />
  </div>

相对于

<div >
    <h3>Blah</h3>
    <img src="foo.jpg" class="item-photologos" onclick="clickedImage(name,i)"   />
    <img src="bar.jpg" class="item-photologos" onclick="clickedImage(name,i)"   />
</div>

JsFiddle here

您可以在每个图像上使用 JQuery On 方法来添加点击事件侦听器。

$(".item-photologos").on("click", function(e) {
  console.log(e);
});