2

我注意到，如果您在可刷新的局部视图中添加不显眼的链接，例如

<a href="/" data-delete-chapter="@Model.Chapter.ChapterId" class="delete-chapter" >
    Delete
</a>

在 javascript 文件中连接以执行（不那么难看的）Jquery 弹出删除确认）：

$("[data-delete-chapter]").each(function () {
    $(this).click(  ...

然后在通过 ajax 刷新部分视图时，这些 javascript 处理程序将消失，因此您最终不得不在每次 ajax 调用时刷新它们。您可以使用 OnSuccess AjaxOption: 或直接在 html 中作为 data-ajax-success 执行此操作，例如我的页面上一个按钮：

<a data-ajax="true" data-ajax-loading="#chapterAjaxImage" data-ajax-method="GET"
data-ajax-mode="replace" data-ajax-update="#chapterContainer"
href="ScrollChapterPrev/@(Model.VideoId)?pageNumber=@(Model.PageNumber)"
data-ajax-success="afterChapterRefresh()" class="gallery-prev">
    <img src="@Url.Content("~/Content/Images/play/chapter-slider-prev.png")" alt="prev"     />
</a>

但是我觉得在刷新我的章节列表的多个地方有 data-ajax-success="afterChapterRefresh()" 并不比让我的原始删除链接使用 javascript 更不显眼，从而避免需要引用刷新 JS 函数：

<a href="javascript:deleteChapter(10)" class="delete-chapter" >
    Delete
</a>

在这种特殊情况下，有没有更好的方法，或者我是否尽可能不引人注目？

4

1 回答 1

4

通过 ajax 加载内容意味着，在事件（点击或其他）有界之后，您正在向 DOM 注入一些东西。所以新注入的元素不会有那个事件绑定。

jQueryon会有所帮助。on 将处理当前元素和未来元素

改变这个

$("[data-delete-chapter]").each(function () {
     $(this).click(function(){
      //do something
     });
});

对此

$(document).on("click","[data-delete-chapter]"(function(){
  //do something
});
于 2012-06-12T01:01:07.487 回答