1

在过去的几天里，我一直试图让我的 C# 变量值通过 JavaScript 与我的 HTML 代码进行通信，现在我有了这个 HTML 代码，我想在页面加载时通过 C# 中的值进行更改。在页面加载时，我想通过 JavaScript 从我的 c# 变量值中设置 SPAN 的 css 宽度值。

progressBarPercentage SPAN 是我想要设置 CSS 宽度的那个，因为这就是我的 jQuery 进度条想要的值。宽度将是一个百分比，因此这本身就可以工作：

<span id="progressBarPercentage" style="width: 40%"></span>

但这就是我想要做的：

HTML

    <div id="progressBarArea" class="progress-bar orange stripes">
        <asp:Label ID="progressBarText" runat="server" Visible="true" Text="49%" CssClass="progressBarText"></asp:Label>
        <span id="progressBarPercentage" onload="setProgressBarPercentage()"></span>
        <p class="align-center">Points Until Next Level: <asp:Label id="pointsUntilNextLevelLabel" runat="server" Text="0" CssClass="pointsUntilNextLevelLabel"></asp:Label></p>
    </div>

C＃ 

    protected double percentageLevelComplete { get; set; }

JavaScript

<script type="text/javascript">
    function setProgressBarPercentage(){
        var element = document.getElementById("progressBarPercentage");
        element.style.width = <%=percentageLevelComplete%> + "%";
    }
</script>

我正在做的事情是正确的吗？如果是这样，我做错了什么，因为目前这不起作用。

4

1 回答 1

1

您可以使用此代码（不带 javasript）：

<div id="progressBarArea" class="progress-bar orange stripes">
        <asp:Label ID="progressBarText" runat="server" Visible="true" Text="49%" CssClass="progressBarText"></asp:Label>
        <span id="progressBarPercentage" style="width:<%=percentageLevelComplete %>%"></span>
        <p class="align-center">Points Until Next Level: <asp:Label id="pointsUntilNextLevelLabel" runat="server" Text="0" CssClass="pointsUntilNextLevelLabel"></asp:Label></p>
    </div>
于 2013-03-19T22:24:36.743 回答