在 asp.net 和 c# 中显示文本时添加延迟

Question

我正在尝试在我的应用程序中显示文本。输入是我使用 FileUpload 接受的文本文件。我必须将文本拆分为单词，并将每个单词拆分为各自的字符。然后首先按字母顺序显示每个单词，然后以选取框显示整个单词。

到目前为止，我已成功接受该文件。我还设法拆分内容。但是我不知道如何在显示每个字母后添加延迟。此外，在显示每个字符之后，它必须在下一个字符出现之前消失。我尝试使用 Thread.Sleep()，但它所做的只是冻结我的 UI，让线程在开始时进入睡眠状态，并立即显示所有内容。

等待 Task.Delay() 也是如此。

有人告诉我使用计时器，但我是 C# 编程新手，不知道它们是如何工作的。到目前为止，这就是我所做的。第一个按钮（即Button1）按原样显示文件的内容。第二个按钮（即Button2）用于分割文本。

aspx.cs 文件：

protected void Page_Load(object sender, EventArgs e)
{

}
protected void Button1_Click(object sender, EventArgs e)
{
    String a = FileUpload1.FileName;
    String ext = Path.GetExtension(a);
    //Label1.Text = ext;
    if (ext == ".txt")
    {

        System.IO.StreamReader reader = new System.IO.StreamReader(FileUpload1.FileContent);
        string text = reader.ReadToEnd();
        //Response.Write(text);
        TextBox1.Text = text;



        //Above section for text file


    }
    if (ext == ".docx" || ext == ".doc")
    {
        //String b = FileUpload1.PostedFile.FileName;
        // Open a doc file.

        string filename = Path.GetFileName(FileUpload1.FileName);
        FileUpload1.SaveAs(Server.MapPath("~/") + filename);
        Application application = new Application();
        Document document = application.Documents.Open(Server.MapPath("~/") + filename);

        // Loop through all words in the document.
        int count = document.Words.Count;
        for (int i = 1; i <= count; i++)
        {
            // Write the word.
            string text = document.Words[i].Text;
            //Response.Write(text);
            TextBox1.Text = text;
        }
        // Close word file
        application.Quit();
    }
}

protected void Button2_Click(object sender, EventArgs e)
{
    String a1 = FileUpload1.FileName;
    String ext1 = Path.GetExtension(a1);
    if (ext1 == ".txt")
    {

        System.IO.StreamReader reader = new System.IO.StreamReader(FileUpload1.FileContent);
        string text = reader.ReadToEnd();


        /*foreach (char c in text)
        {
            TextBox2.Text = c.ToString();
            System.Threading.Thread.Sleep();
        }*/


        List<string> list = new List<string>(); //code for splitting 
        String[] words = text.Split();
        for (int i = 0; i < words.Length; i++)
        {
            list.Add(words[i]);
        }
        foreach (string word in words)
        {

            Char[] letters = word.ToCharArray();
            foreach (char letter in letters)
            {

                Response.Write("<marquee>"+letter+"</marquee>");
                Response.Write("<br>");



            }
            Response.Write("<marquee>" + word + "</marquee>");
            Response.Write("<br>");

        }

    }

}

Answer 1

您应该使用客户端脚本而不是服务器代码...使用 updatePanel.... :) 在你的 aspx 中：

<asp:UpdatePanel ID="updatePanel1" runat="server">
  <ContentTemplate>
    <div style="display:none">
    <!-- Hidden Field For Storing our formatted Text -->
    <asp:Literal ID="hiddenLiteral" runat="server"/></div>
    <!-- a field for store Javascript -->
    <asp:Literal ID="scriptLiteral" runat="server"/>
    <!-- a field which use for Showing Text To User -->
    <asp:Literal ID="displayLiteral" runat="server"/>

   </ContentTemplate>
</asp:UpdatePane>

然后为literalValue编写一个javascript，然后更新updatePanel，如下所示：

protected void Button2_Click(object sender, EventArgs e)
{
    String a1 = FileUpload1.FileName;
    String ext1 = Path.GetExtension(a1);
    if (ext1 == ".txt")
    {

        System.IO.StreamReader reader = new System.IO.StreamReader(FileUpload1.FileContent);
        string text = reader.ReadToEnd();

        List<string> list = new List<string>(); //code for splitting 
        String[] words = text.Split();
        for (int i = 0; i < words.Length; i++)
        {
            list.Add(words[i]);
        }
        var textTobeShown = new List<string>();
        foreach (string word in words)
        {

            Char[] letters = word.ToCharArray();
            foreach (char letter in letters)
            {

               textTobeShown.Add("<marquee>"+letter+"</marquee>");

            }
               textTobeShown.Add("<marquee>" + word + "</marquee>");
        }
    //use <sep> for separating text
    hiddenLiteral.text=String.Join("<sep>",textTobeShown);
    //Call Our Javascript Function when updatePanel Update Fields Value
    scriptLiteral.Text=String.Concat("<script> DisplayText('",hiddenLiteral.ClientID,"','",displayLiteral.ClientID,"');  </script>");

    //updating our updatePanel
    updatePanel1.Update();
    }

}

并在您的 Html (aspx) 中定义一个脚本标签，如下所示：

<script>

    function DisplayText(hiddenFieldId,textFieldId){
      var hiddenValue=document.getElementById(hiddenFieldId);
      var textField=document.getElementById(textFieldId);
      if(!hiddenValue || !textField) {throw 'HddenField or TextField Not Find';}
      var textToBeShown=hiddenValue.innerHTML.split('<sep>');
      if(textToBeShown.length==0){throw 'there is nothing to show';}
      var count=textToBeShown.length;

      //create delay for shown Text, in  0.5secon,1second...
      var delay=0.5; 

      //loop  through text and show them, after showing each text, delay for   500ms(0.5s)
    timeout([0,count], 1, function(i){
    textField.innerHTML+=textToBeShown[i]+'<br />';
});

    }

 function timeout(range, time, callback){
    var i = range[0];                
    callback(i);
    Loop();
    function Loop(){
        setTimeout(function(){
            i++;
            if (i<range[1]){
                callback(i);
                Loop();
            }
        }, time*1000)
    } 
}    
</script>