在部分視圖中調用jquery ajax後，css將無法加載

我試圖在用戶單擊按鈕時更改菜單的內容。 CSS最初加載得很好，但是一旦我按下按鈕啓動ajax調用，菜單欄就會返回，但是沒有應用CSS。所有代碼都在MVC 4局部視圖中。在部分視圖中調用jquery ajax後，css將無法加載

Before I hit the button

After I hit the button

這裏是我的JS

$(document).ready(function() { 

    $("#menu").wijmenu({ 
     orientation: 'vertical' 
    }); 

    $("#TDButtons a").click(function() { 
     var href = $(this).attr("href"); 
     $('#menuAjax').fadeOut('slow', LoadAjaxContent(href)); 
     return false; 
    }); 

    function LoadAjaxContent(href) { 

     $.ajax(
      { 
       url: href, 
       success: function (data) { 
        $("#menuAjax").html(data).fadeIn('slow'); 
       } 
      }); 

    } 
});

這裏的導航標籤

<nav id="menuAjax"> 
     <ul id="menu"> 
      <li><a href="#">Breaking News</a> 
       <ul> 
        ...

這裏是HTML的按鈕來啓動AJAX

<div class="navDiv"> 
     <div id="TDButtons"> 
      <a href="@Url.Action("_menu", "Home", new { TakeoutDelivery = "TakeOut" }, null)"> 
       <img class="headerLogo" src="../../Content/Images/TakeoutButton.jpg" alt="Take Out" /></a> 
      <a href="@Url.Action("_menu", "Home", new { TakeoutDelivery = "Delivery" }, null)"> 
       <img class="headerLogo" src="../../Content/Images/DeliveryButton.jpg" alt="Delivery" /></a> 
     </div>

請讓我知道你是否需要別的東西。

來源

2012-10-17 dright

我需要添加

$("#menu").wijmenu({ 
    orientation: 'vertical' 
});

到LoadAjaxContent功能。

function LoadAjaxContent(href) { 
    $.ajax({ 
     url: href, 
     success: function(data) { 
      $("#menuAjax").html(data).fadeIn('slow'); 
      $("#menu").wijmenu({ 
       orientation: 'vertical' 
      }); 
     } 
    }); 
}

來源

2012-10-17 04:36:01 dright

把它放在頁面上。

function pageLoad(sender, args) { 
$('#OutsideDiv').trigger('create'); 
}

這將重新附加頁面加載的CSS。我猜想的問題是它只是一個部分帖子，因此你正在損失樣式表。在進行部分回發呼叫時，我在jquery-mobile中遇到了與我的移動網站非常類似的問題。這個固定它重新部分回發.....

注：有一個非常小的延時才能使...不知道這是否會成爲你的問題....

希望它幫助

乾杯羅賓

來源

2012-10-17 04:05:19

在部分視圖中調用jquery ajax後，css將無法加載

回答

相關問題