使用html中的javascript變量隱藏/顯示html標簽

Question

我正在嘗試根據cookie值顯示/隱藏html標簽。 我可以通過將ID分配給該錨標記並在javascript中將其顯示設置為不顯示來執行此操作，但是我只希望在html中對此顯示。

示例代碼：

從cookie獲取公司名稱。

$(document).ready(function () {
   var companyName = getCookie("GlobalCompanyName"));
});

想要做這樣的事情。

<div class="coach_title_row">
  <% if (companyName == "XYZ" )
  { %>
     <a class="new" href="<%= this.ResolveUrl("~/")%>Reports/Tool/Step1.aspx" title="Create New Report"><img src="<%= this.ResolveUrl("~/")%>Static/V3/Images/ReportingTool/new_report.png"/></a>
<% } %>
</div>

我知道如何使用jQuery來做到這一點，但我只是不想使用它。 我在問是否可以在html內使用jQuery變量進行比較（在if / else語句中）。

Answer 1

起初，我想知道為什么不只使用常規的javascript / jquery？ 但是，在查看您提供給我們的代碼后，我認為您可能需要一種解決方法。 解決方案似乎很簡單，所以我想我可能不太了解您的問題，也許您正在使用的堆棧的更多詳細信息會有所幫助？

這是使用簡單jQuery實現此目的的方法。 但是，根據您的設置，這很可能行不通，以下說明。

var companyName;
var myHtml = "<a href="#">Whatever you need here</a>;

jQuery(document).ready(function () {
   companyName = getCookie("GlobalCompanyName"));
   if(companyName == 'xyz'){
     jQuery('.coach_title_row).append(myHtml);
   }
});

話雖如此，看來您正在使用模板表示法中的ASP。 為什么不僅僅在您的控制器中獲取cookie值並將其傳遞到視圖中？ 這比在這種情況下嘗試使用javascript要干凈得多。

另外，如果您使用javascript插入包含模板屬性的html，則可能會出現延遲加載問題。 將加載html，但不會渲染任何后端內容，因為javascript在客戶端上運行時正在插入此內容。

解決方法是將鏈接插入到您的視圖中，然后在Cookie正確的情況下使用javascript在頁面加載時“顯示” div。

的HTML：

div class="coach_title_row">

     <a class="new" **style="display"none"**; href="<%= this.ResolveUrl("~/")%>Reports/Tool/Step1.aspx" title="Create New Report">

  <img src="<%=   this.ResolveUrl("~/")%>Static/V3/Images/ReportingTool/new_report.png"/>

    </a>

</div>

腳本：

var companyName;

jQuery(document).ready(function () {
   companyName = getCookie("GlobalCompanyName"));
   // Instead just show the link already loaded, given cookie is correct
   if(companyName == 'xyz'){
     jQuery('.new').css('display','block');
   }
});