如何將Razor語法“ @”應用於“ <div> 在ASP.NET MVC 5中使用jQuery標記”？

Question

您能告訴我如何通過jQuery將@Html.Partial("_Layout")到<div class="demo">嗎？

我已經嘗試過了，但是沒有用：

<input type="button" id="btn" value="Click me" />
<div class="demo">
</div>

jQuery代碼：

$('#btn').click(function(){
     $('.demo').append('@@Html.Partial("_Layout")');
     $('.demo').html($('.demo').text());
});

但是我收到的結果是：

<div class="demo">
     @Html.Partial("_Layout")
</div>

瀏覽器了解@Html.Partial("_Layout")是純文本，而不是Razor語法。

請告訴我如何解決？ 非常感謝！！！

Answer 1

@Html.Partial("_Layout")將在服務器端而不是客戶@Html.Partial("_Layout")解析。 如果需要動態加載，則應提供一個Action並使用jquery $ajax函數：

1）在您的控制器上：

public ActionResult Layout()
{
  return PartialView('_Layout');
}

2）在您看來

$('#btn').click(function(){
  $.ajax({
    url: '/Controller/Layout',
    dataType: "html",
    success: function (data) {
    $('.demo').html(data);
   }
  });
});

Answer 2

剃須刀引擎會將@@解釋為字符'@'。

我認為，如果您使用ajax調用視圖_Layout並可以將其發布到div演示中，則效果會更好。

樣品：

<input type="button" id="btn" value="click me"/>
<div id="demo"></div>
<script>
$('#btn').on('click',function(){
    e.preventDefault();
    $.ajax({
      url:'@Url.Action("PartialLayout")',
      type: 'post' // according to haack and scott hanselmen, its recommended to use post in the ajax call
    }).done(function(result){
         $('#demo').html(result);
    });
});
</script>

//在您的控制器中編寫此代碼

[HttpPost]
public ActionResult ParitalLayout()
{
     return PartialView("_Layout");
}

希望這段代碼對您有所幫助