如何在.aspx文件上使用Javascript检查超时值后调用.ascx的按钮单击事件

Posted 2023-03-23

【中文标题】如何在.aspx文件上使用Javascript检查超时值后调用.ascx的按钮单击事件

【英文标题】：How to Invoke Button click Event of .ascx after checking timeout value using Javascript on its .aspx File

【发布时间】：2012-08-22 22:04:14

【问题描述】：

我有 2 个文件。一种是 aspx 及其 ascx。 aspx 包含计算考试倒计时时间的 javascript。 当计时器值达到 00:00:00 时，我想调用 ascx 文件中的“提交考试”事件。

最终论文.aspx.cs

public partial class Final_Paper : System.Web.UI.Page 

    long timerStartValue = 600;

    protected void Page_Load(object sender, EventArgs e)
                
        if (!Page.IsPostBack)
        
            this.timerStartValue = long.Parse(ConfigurationManager.AppSettings["Delay"].ToString());
            this.TimerInterval = 500;
        
    

    public string message()
    
        string val;
        val = Request.Form["timerData"].ToString();
        TimeSpan ts = TimeSpan.FromMilliseconds(Convert.ToDouble(val.ToString()));
        return ts.ToString();            
    

    void Page_PreRender(object sender, EventArgs e)
    
        StringBuilder bldr = new StringBuilder();            
        bldr.AppendFormat("var Timer = new myTimer(0,1,'2','timerData');", this.timerStartValue, this.TimerInterval, this.lbltime.ClientID);
        bldr.Append("Timer.go()");
        Page.ClientScript.RegisterStartupScript(this.GetType(), "TimerScript", bldr.ToString(), true);
        Page.ClientScript.RegisterHiddenField("timerData", timerStartValue.ToString());
    

    void Page_PreInit(object sender, EventArgs e)
    
        string timerVal = Request.Form["timerData"];
        if (timerVal != null || timerVal == "")
        
            timerVal = timerVal.Replace(",", String.Empty);
            timerStartValue = long.Parse(timerVal);
        
    

    private Int32 TimerInterval
    
        get
        
            object o = ViewState["timerInterval"];
            if (o != null)  return Int32.Parse(o.ToString()); 
            return 50;
        
        set  ViewState["timerInterval"] = value; 

    

最终论文.aspx

<script type="text/javascript">
    function myTimer(startVal, interval, outputId, dataField) 
        this.value = startVal;
        this.OutputCntrl = document.getElementById(outputId);
        this.currentTimeOut = null;
        this.interval = interval;
        this.stopped = false;
        this.data = null;
        var formEls = document.form1.elements;
        if (dataField) 
            for (var i = 0; i < formEls.length - 1; i++) 
                if (formEls[i].name == dataField) 
                    this.data = formEls[i];
                    i = formEls.length + 1;
                
            
        

        myTimer.prototype.go = function() 
            if (this.value > 0 && this.stopped == false) 
                this.value = (this.value - this.interval);
                if (this.data) 
                    this.data.value = this.value;
                
                var current = this.value;
                this.OutputCntrl.innerhtml = this.Hours(current) + ':' + this.Minutes(current) + ':' + this.Seconds(current);
                this.currentTimeOut = setTimeout("Timer.go()", this.interval);
            
            else                 
                alert('Time Out!');
                window.location('index.aspx');
            



        
        myTimer.prototype.stop = function() 
            this.stopped = true;
            if (this.currentTimeOut != null) 
                clearTimeout(this.currentTimeout);
            
        
        myTimer.prototype.Hours = function(value) 
            return Math.floor(value / 3600000);
        
        myTimer.prototype.Minutes = function(value) 
            return Math.floor((value - (this.Hours(value) * 3600000)) / 60000);
        
        myTimer.prototype.Seconds = function(value) 
            var hoursMillSecs = (this.Hours(value) * 3600000)
            var minutesMillSecs = (this.Minutes(value) * 60000)
            var total = (hoursMillSecs + minutesMillSecs)
            var ans = Math.floor(((this.value - total) % 60000) / 1000);

            if (ans < 10)
                return "0" + ans;

            return ans;
        
               



</script>

Exam_paper.ascx

protected void btnSubmit_Click(object sender, EventArgs e)
    
        lbTime.Text = ((Final_Paper)this.Page).message();
        foreach (ListViewItem item in paper_list.Items)
        
            RadioButton ansA = (RadioButton)item.FindControl("ansA");
            RadioButton ansB = (RadioButton)item.FindControl("ansB");
            RadioButton ansC = (RadioButton)item.FindControl("ansC");
            RadioButton ansD = (RadioButton)item.FindControl("ansD");
            Label rightAns = (Label)item.FindControl("rightAns");


            if (ansA.Checked && rightAns.Text == "ansA")
            
                a = a + 1;
            
            else if (ansB.Checked && rightAns.Text == "ansB")
            
                a = a + 1;
            
            else if (ansC.Checked && rightAns.Text == "ansC")
            
                a = a + 1;
            
            else if (ansD.Checked && rightAns.Text == "ansD")
            
                a = a + 1;
            
            else
            
                a = a + 0;
            
        

        marks = (float)2 * (float)a;

        addResult();

        Session.Remove("stud");
        if (Session["stud"] == null)
        
            Response.Redirect("index.aspx");
                    

    

【参考方案1】：

使您的 btnSubmit 成为您的用户控件的公共属性，以便可以从您的 aspx 文件访问它，同时可以从客户端脚本访问它。这是一个小例子。

用户控制代码：

public partial class Sample : System.Web.UI.UserControl

    public Button SubmitButton
     get  return this.btnSubmit;  set  this.btnSubmit = value;  

    protected void Page_Load(object sender, EventArgs e)
    

    


    protected void btnSubmit_Click(object sender, EventArgs e)
    
        //Do Something
    

用户控件 HTML：

<asp:Button ID="btnSubmit" runat="server" Text="Button" 
    onclick="btnSubmit_Click" />

ASPX：

<head runat="server">
    <script>
        setTimeout(function () 
            document.getElementById("<%=Sample1.SubmitButton.ClientID %>").click();
        , 2000);
    </script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <uc1:Sample ID="Sample1" runat="server" />
    </div>
    </form>
</body>
</html>

祝你好运！

【参考方案2】：

提交按钮的位置无关紧要。你只需要它的ID。然后，在超时调用按钮的单击方法。像这样的：

document.getElementById("mySubmitExamButtonId").click();

【参考方案3】：

您可以添加一个隐藏按钮，然后附加 btnSubmit_click 事件。然后你可以使用 javascript 调用事件

__doPostBack('<%=btnSubmit.ClientID%>',"OnClick")