Question

我有一个通过JQuery ajax加载的局部视图。它枚举模型中的属性并呈现需要绑定JavaScript事件的HTML元素。

以下是我现在使用的一些简化的剃刀代码

foreach(MyObject item Model.MyObjectList)
{

   string containerId = "Container" + item.Id;
   string onMouseOut = "DoSomething('"+containerId+"',@Model.Id)";
   <div id="@containerId" onmouseout="@onMouseOut">
     //Other code here
  </div>
}

这可以正常工作但是通常认为在JQuery中绑定事件会更好，如果我这样做，你也可以利用JQuery事件，例如＆＃34; onmouseleave＆＃34;。

所以我可以做的另一种方法是在每个枚举中放置一个脚本块来设置事件，如此

<script type='text/javascript'>
  $('#@containerId').mouseout(function(){
   DoSomething('@containerId',@Model.Id)
  });
</script>

然而，这会导致渲染大量脚本块。

在部分视图中设置事件还有其他更好的解决方案吗？

Answer 1

使用.on方法将事件绑定到并不总是在DOM内的事物。

$('#foo').on('click', function() {
    // do stuff
});

然后，您无需在部分中插入脚本标记。有一个类似于此的方法是.live（），但是从v1.7开始已经弃用并从v1.9开始删除。

jQuery API : .on();

为部分视图设置JavaScript事件处理程序的最佳实践

1 个答案: