進度條

-2

可能重複：
progress bar on a survey using c#進度條

我在ASP .NET中使用C＃做了網上調查。我的調查包含30個問題，每個問題在不同的頁面上。我想顯示一個進度條，顯示用戶他完成了多少。我怎樣才能做到這一點？

我認爲，如果我知道總頁數，在每個頁面上點擊提交按鈕時，進度條將根據用戶所在的頁面填充。例如，如果我在30頁的第5頁上，那麼進度條應該填上5/30或類似的東西。

來源

2012-01-31 Bibu

你有正確的想法。你真的堅持什麼？你有沒有嘗試爲此編寫任何代碼？每個問題都是自己的.ASPX文件嗎？ – Yuck 2012-01-31 15:31:03

是的。每個問題都在aspx頁面 – Bibu 2012-01-31 15:34:55

@Bibu - 請不要轉發您的問題。 – 2012-01-31 15:35:22

最簡單的方法是簡單地在會話中和下一頁的負載中存儲完成的頁數或當前頁碼，使用存儲的值設置進度欄。

來源

2012-01-31 15:31:10 emd

以及如何保留已完成的頁面？ – Bibu 2012-01-31 15:33:33

@Bibu：你只是增加你從會話變量中獲得的數字 - 然後將它存儲在下一頁的相同位置。 – woohoo 2012-01-31 15:40:02

我使用這個簡單的jQuery腳本，我有一個進度條圖像，它只是空的進度條，然後我有另一個圖像來填補進度條。我調整div的寬度，其中包含填充部分（progressBarFill div其背景圖像是寬度爲1像素的純色圖像）。在每一頁你只需要改變步號，

<script type="text/javascript"> 
    $(document).ready(function() { 
     var progressBarWidth = 211;   // this is total width of the progress bar 
     var totalStepsInAppProcess = 5;  // number of steps in an application process 
     var eachStepPercent = 100/5;  // each steps percentage 
     var numberOfSubStepsForStep = 1; // if there are any sub steps in the step - if no sub steps then it should be 1 to avoid divide by zero error 
     var stepNumber = 3;     // step number 
     var percentForSubStep = Math.ceil(new Number(eachStepPercent/numberOfSubStepsForStep).toFixed(2)) * stepNumber; // equivalent percentage for a step 
     var subStepNumber = 1;    // sub step number - if no sub steps then it should be 1 to avoid math errors 
     var widthForThisStep = Math.ceil((progressBarWidth * (percentForSubStep/100)) * subStepNumber); // progress bar width for this step 
     var label = (document.getElementById('<%=((Label)Master.FindControl("lb_ProgressBarText")).ClientID %>')); 
     $('#<%=((Label)Master.FindControl("lb_ProgressBarText")).ClientID %>').text('You are ' + percentForSubStep + '% done'); 
     $('.progressBarFill').width(widthForThisStep); 
    </script>

我希望這會有所幫助。

來源

2012-01-31 15:40:17 DotNetUser

如果您的頁面始終處於相同的順序，那麼您就知道該序列中的哪個頁面。如果不是相同的順序，那麼你將不得不使用會話來保存頁面，或者可能是一個隱藏的字段被返回，最後一頁的數量是什麼。

- 設計明智，你可以做30個不同的圖像，而不是最好的解決方案。

- 使用一個滑動圖像，使用css背景定位，每頁將滑過一定比例，直到它到達容器的另一側，即100％。

- 或者使用css，在另一個div中有一個div，外部div將具有完整的寬度和一個邊框，那麼內部會每頁增長一定的百分比。你給內部一個不同的背景顏色。

來源

2012-01-31 15:40:25

回答

相關問題