使用 JQuery 在部分视图中更改 css

Question

我有一个带有按钮的视图，下面是一个 div，使用 ajax 和部分视图填充。

这是属于视图上按钮的代码；

$(document).on('click', '.btn-release', function () {
    StartReleaseVersionEdit();
    ReleaseVersionEdit();
}

使用 Ajax 我可以更改 table 中显示的数据，当我单击页面顶部的按钮时会发生这种情况；

function StartReleaseVersionEdit() {
    var url = '@Url.Action("ChangelogMavisTabel")';
    url = url + '?order=0&paging=1000';
    $.ajax({
        type: "GET",
        cache: false,
        url: url,
        success: function (data) {
            $("div#changelog").html(data);
        }
    });
}

此代码完美运行。一旦我想使用 JQuery 更改此局部视图中元素的 css 以将显示设置为 none，它会工作一瞬间，但随后 returns 到它的之后的默认值。

function ReleaseVersionEdit(){    
    $('.releasebutton').css('display','inline');
    // .releasebutton default display=none
}

我该怎么做才能使它正常工作？我不能将 JQuery 放在局部视图的代码中，因为它是由视图上的按钮触发的。

Answer 1

将 ReleaseVersionEdit() 函数移动到 AJAX 调用的成功方法中，这样您就可以保证它仅在部分加载后调用。请记住 AJAX 调用是异步的 - jQuery.ajax():

$(document).on('click', '.btn-release', function () {
     StartReleaseVersionEdit();
  // ReleaseVersionEdit(); Remove from here as this could execute before the partial is loaded
}

function StartReleaseVersionEdit() {
    var url = '@Url.Action("ChangelogMavisTabel")';
    url = url + '?order=0&paging=1000';
    $.ajax({
        type: "GET",
        cache: false,
        url: url,
        success: function (data) {
            $("div#changelog").html(data);
            ReleaseVersionEdit(); // Added here so will always be called after the partial has been loaded
        }
    });
}

使用 JQuery 在部分视图中更改 css

Changing css in partial view using JQuery

css

ajax

asp.net-mvc

jquery

partial-views