jQuery Ajax局部视图只工作一次

我有一个asp.net页面，它在我当前正在进行工作的选项卡中返回部分视图。我已经把jQuery全部设置好了，它可以工作了。它只工作一次，通过ajax返回部分视图

.html（结果）

然而，这只适用于一次。我点击按钮，它在幕后完成了它应该做的一切，它应该替换html。然后，当我再次单击按钮时，什么也没有，就好像这些按钮的jQuery不再存在。没有页面重新加载，这都是通过ajax完成的

第一次加载页面时使用的HTML和通过.HTML（result）返回的HTML是完全相同的HTML。这两种方法都使用相同的部分视图

返回此部分视图时，jQuery是否以某种方式断开连接

以下是我的Ajax调用：

function updateSort(object) {
    jQuery.ajax({
        url: "/MasterList/UpdateSort",
        type: "get",
        data: object, //if you need to post Model data, use this
        success: function (result) {
            //alert('success');
            //console.log(result);
            jQuery("#procedures").html(result);
        }
    });
}

点击按钮如下：

jQuery(".btnMoveUp").click(function () {
        var $this = jQuery(this),
            processID = $this.data('processid'),
            currProcedureID = $this.data('procedureid'),
            currSortOrder = $this.data('sortorder'),
            idx = jQuery('.commentlist li').index($this.closest('li')),
            $prevLi = jQuery('.commentlist li').eq(idx - 1),
            $anchor = $prevLi.find('.btnContainer a'),
            prevProcedureID = $anchor.data('procedureid'),
            prevSortOrder = $anchor.data('sortorder');

        // create object that we can pass to MVC controller
        var objProcedure = {};

        objProcedure = {
            _processID: processID,
            _currProcedureID: currProcedureID,
            _currSortOrder: currSortOrder,
            _switchProcedureID: prevProcedureID,
            _switchSortOrder: prevSortOrder
        }

        updateSort(objProcedure);

    });

为什么这只能工作一次？
我遇到了类似的问题，原因是响应被缓存了。您可以将用于缓存的jQuery ajax属性设置为false

$.ajaxSetup（{cache:false}）
我遇到了类似的问题，这是因为响应被缓存了。您可以将用于缓存的jQuery ajax属性设置为false

$.ajaxSetup（{cache:false}）
在操作中使用
[OutputCache]
属性帮助避免缓存

[OutputCache(Duration = 0)]

在操作中使用
[OutputCache]
属性有助于避免缓存

[OutputCache(Duration = 0)]

您应该使用委托事件处理程序，如下所示：

$('#procedures').on('click', '.btnMoveUp', function () {
    var $this = jQuery(this),
        processID = $this.data('processid'),
        currProcedureID = $this.data('procedureid'),
        currSortOrder = $this.data('sortorder'),
        idx = jQuery('.commentlist li').index($this.closest('li')),
        $prevLi = jQuery('.commentlist li').eq(idx - 1),
        $anchor = $prevLi.find('.btnContainer a'),
        prevProcedureID = $anchor.data('procedureid'),
        prevSortOrder = $anchor.data('sortorder');

    // create object that we can pass to MVC controller
    var objProcedure = {};

    objProcedure = {
        _processID: processID,
        _currProcedureID: currProcedureID,
        _currSortOrder: currSortOrder,
        _switchProcedureID: prevProcedureID,
        _switchSortOrder: prevSortOrder
    }

    updateSort(objProcedure);
});

您应该使用委托事件处理程序，如下所示：

$('#procedures').on('click', '.btnMoveUp', function () {
    var $this = jQuery(this),
        processID = $this.data('processid'),
        currProcedureID = $this.data('procedureid'),
        currSortOrder = $this.data('sortorder'),
        idx = jQuery('.commentlist li').index($this.closest('li')),
        $prevLi = jQuery('.commentlist li').eq(idx - 1),
        $anchor = $prevLi.find('.btnContainer a'),
        prevProcedureID = $anchor.data('procedureid'),
        prevSortOrder = $anchor.data('sortorder');

    // create object that we can pass to MVC controller
    var objProcedure = {};

    objProcedure = {
        _processID: processID,
        _currProcedureID: currProcedureID,
        _currSortOrder: currSortOrder,
        _switchProcedureID: prevProcedureID,
        _switchSortOrder: prevSortOrder
    }

    updateSort(objProcedure);
});

如果绑定了事件处理程序的元素在被替换的html中，那么是的，您将丢失这些绑定。要么在加载新html后重新绑定，要么使用事件委派。我猜您是在用新元素替换元素，即使标记完全相同，元素也不相同，并且事件处理程序将丢失。您需要的是事件委派。@adeneo是的，整个div将被部分视图中的新结果替换。@adeneo我试图将jQuery更改为use.on（“单击”但这似乎没有解决任何问题。这就是我缺少的吗？或者我真的必须在Ajax成功部分重新绑定它们吗？复制代码似乎太多了。@adeneo nevermind我解决了它。我只是将我的单击事件扔到函数中，在初始加载时调用函数，然后在我的.success中调用它。如果与事件处理程序绑定的事件在被替换的html中，那么是的，您将丢失这些绑定。在加载新html后重新绑定，或者使用事件委派。我猜您是在用新元素替换元素，即使标记完全相同，元素也不相同，并且事件处理程序将丢失。您需要做什么需要的是事件委派。@adeneo是的，整个div将被部分视图中的新结果替换。@adeneo我试图将jQuery更改为use.on（“单击”但这似乎没有解决任何问题。这就是我缺少的吗？或者我真的必须在Ajax成功部分重新绑定它们吗？复制代码似乎太多了。@adeneo nevermind我已经解决了它。我只是将我的单击事件扔到函数中，在初始加载时调用函数，然后在我的成功回调中调用它。这没有解决问题很遗憾，我无法修复它，但我确实认为这将修复我在缓存方面遇到的另一个问题。：）啊，很高兴我至少能帮上一点忙。这将起作用，但我相信它将关闭所有ajax缓存，而不仅仅是此更新的缓存。您也可以使用$.ajax（{url:“myurl”）关闭单个命令的缓存，success:myCallback，cache:false}；，很遗憾，这并没有解决它，但我确实认为这将解决我在缓存方面遇到的另一个问题。：）啊，很高兴我至少能帮上一点忙。这会起作用，但我相信它会关闭所有ajax缓存，而不仅仅是此更新的缓存。您也可以使用$.ajax（{url:“myurl”，success:myCallback，cache:false}）关闭单个命令的缓存；看到了吗？我把它改成了这个方法，它工作起来很有魅力。我相信你，但是你能解释一下为什么这个方法比函数方法好，这样我才能更好地理解它吗？再次感谢。这会在pageload上附加一次事件处理程序。li说，在每次ajax调用上附加相同的事件处理程序可能会导致问题如果由于某种原因所有元素都没有被替换，那么事件处理程序可能会被附加两次等@adeneo请检查我的问题：我将其更改为此方法，它的工作方式很有魅力。我相信你，但你能解释一下为什么此方法比函数方法更好，以便我能更好地理解它吗？谢谢再次说明。这会在pageload上附加一次事件处理程序。在每次ajax调用上附加相同的事件处理程序可能会导致问题，例如，如果由于某种原因所有元素都没有被替换，事件处理程序会以某种方式被附加两次等@adeneo请检查我的问题，网址为：