0

これは jQuery UI と Javascript に関する非常に単純な質問かもしれませんが、私はまだこれらの構文について自分のやり方を感じています。C# (ASP.NET) プログラムがさまざまな関数で特定のポイントに到達するたびに、jQuery の進行状況バーを更新しようとしています。私はこれを正しくやっていますか？ページに空の進行状況バーが表示されますが、進行状況を更新できません。

ここに私のスクリプトがあります：

  <script type="text/javascript">
  $(document).ready(function() {
    $("#progressbar").progressbar({ value: 0 });
  });

function updateProgress(number) {
        if (number < 100) {
            $("#progressbar").progressbar("value", number);
        }
    }
</script>

ここに私のスクリプト参照のいくつかがあります：

 <link href="Styles/tomcat.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="colorbox.css" />
<script src="Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-1.8.21.custom.js" type="text/javascript"></script>
<script type="text/javascript" src="Scripts/jquery.colorbox.js"></script>
<link href="Content/themes/base/jquery.ui.progressbar.css" rel="stylesheet" type="text/css" />
<link href="Content/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery.ui.core.js" type="text/javascript"></script>
<link href="Scripts/jquery-ui-1.8.21.custom.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery.ui.progressbar.js" type="text/javascript"></script>
<link href="Scripts/ui.all.css" rel="stylesheet" type="text/css" />

ここでは、C# 関数を介して updateProgress() 関数を使用しようとしています。プログレス バーに「10%」を送信しようとしていますが、デバッガーでエラーが発生し、updateProgress() が定義されていないと表示されます。

 ScriptManager.RegisterStartupScript(this, this.GetType(), "temp", "<script language='javascript'>UpdateProgress(10);</script>", false);

編集:次のブール値を追加して、ページの更新と進行状況バーの更新をバイパスしました。

 var runOnce = new Boolean;
runOnce = false;
$(document).ready(function() {
    if(!runOnce)
    {
        $("#progressbar").progressbar({ value: 0 });
        runOnce = true;
    }
});

私はそれが働いているとは思わない。ページが読み込まれるたびにクリアされ、ゼロに戻されます。

4

1 に答える 1

5

JavaScript は大文字と小文字を区別します。関数宣言を にUpdateProgress変更するか、インジェクションを に変更してくださいupdateProgress。

type="text/javascript"また、スクリプトタグに含める必要があると思います-言語は非推奨の属性です。関連: script タグの「lang」属性と「type」属性の違いは何ですか?

編集：上書きされる進行状況を処理するには：

var progressAlreadySet;

$(document).ready(function() {
    $("#progressbar").progressbar(); // initialize

    if (!progressAlreadySet) {
        $("#progressbar").progressbar("value", 0);
    }
});

var updateProgress = function (number) {
    if (number < 100) {
        progressAlreadySet = true;
        $("#progressbar").progressbar("value", number);
    }
};
于 2012-07-13T13:48:02.180 に答える