javascript 使用javascript更改asp.net按钮的文本

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3539317/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 01:26:54  来源:igfitidea点击:

change text of asp.net button with javascript

javascriptasp.net

提问by The Muffin Man

I have a form submit button that has asp.net validators hooked up to it. If I make a javascript function to change the text to processing on click it does not work. The button flags the validators and also causes the whole page to post back. Heres the code I have:

我有一个表单提交按钮,它连接了 asp.net 验证器。如果我创建一个 javascript 函数来将文本更改为单击处​​理,则它不起作用。该按钮标记验证器并导致整个页面回发。这是我的代码:

C#

C#

 protected void Page_Load(object sender, EventArgs e)
{
    btnPurchase.Attributes["onClick"] = "submit()";
}

Html

html

<script type="text/javascript">
    function submit() {
        document.getElementById("ctl00_ContentPlaceHolder1_btnPurchase").value = "Processing";
    };
</script>

My goal is to change the buttons text to purchasing onclick if the form passes validation, and then in my code behind it will change back to the original value once the form posts back.

我的目标是在表单通过验证时将按钮文本更改为购买 onclick,然后在我后面的代码中,一旦表单回发,它将更改回原始值。

采纳答案by The Muffin Man

I ran across this solution which works 100% perfect. I'm using the script manager with update panels...

我遇到了这个 100% 完美的解决方案。我正在使用带有更新面板的脚本管理器...

<script type="text/javascript">

        // Get a reference to the PageRequestManager.
        var prm = Sys.WebForms.PageRequestManager.getInstance();

        // Using that prm reference, hook _initializeRequest
        // and _endRequest, to run our code at the begin and end
        // of any async postbacks that occur.
        prm.add_initializeRequest(InitializeRequest);


        // Executed anytime an async postback occurs.
        function InitializeRequest(sender, args) {
            // Get a reference to the element that raised the postback,
            //   and disables it.
            $get(args._postBackElement.id).disabled = true;
            $get(args._postBackElement.id).value = "Processing...";
        }
        // Executed when the async postback completes.
        function EndRequest(sender, args) {
            // Get a reference to the element that raised the postback
            //   which is completing, and enable it.
            $get(args._postBackElement.id).disabled = false;
            $get(args._postBackElement.id).value = "Purchase";
        }

</script>

回答by RPM1984

I just asked a very similar question (which was answered): ASP.NET Custom Button Control - How to Override OnClientClick But Preserve Existing Behaviour?

我刚刚问了一个非常相似的问题(已回答): ASP.NET 自定义按钮控件 - 如何覆盖 OnClientClick 但保留现有行为?

Essentially you need to preserve the existing behaviour of the submit button (__doPostBack). You do this with Page.GetPostBackEventReference(myButton).

本质上,您需要保留提交按钮 ( __doPostBack)的现有行为。你用Page.GetPostBackEventReference(myButton).

However with validation it's more difficult, so you'll need to do page validation inline (Page.Validate()) or create a custom control like i did and override the OnClientClickand PostBackOptionsmembers.

但是,验证会更困难,因此您需要进行内联页面验证 ( Page.Validate()) 或像我一样创建自定义控件并覆盖OnClientClickPostBackOptions成员。

Custom control is better, as i can now just drop this control on any page i want this behaviour.

自定义控件更好,因为我现在可以将此控件放在我想要这种行为的任何页面上。

You could do the same and expose a public property:

你可以做同样的事情并公开一个公共财产:

public string loadingText {get; set;}

Which could be used to customise the loading text on each page.

可用于自定义每个页面上的加载文本。

You basically need to set the onclick attribute to do the following:

您基本上需要设置 onclick 属性来执行以下操作:

onclick = "if (Page_Validate()) this.text = 'Processing';{0} else return false;"

{0} should be the regular postback action, retrieved from Page.GetPostBackEventReference.

{0} 应该是常规回发操作,从 Page.GetPostBackEventReference 检索。

The resulting logic will be: on click, validate the page, it it succeeds, change the text and postback, if it fails, return false - which will show the validation on the page.

生成的逻辑将是:单击时验证页面,它成功,更改文本并回发,如果失败,则返回 false - 这将在页面上显示验证。

Have the button set to default text "Submit" in the HTML, then wrap the above logic in !Page.IsPostBack so it will reset the text on form submit.

将按钮设置为 HTML 中的默认文本“提交”,然后将上述逻辑包装在 !Page.IsPostBack 中,以便在表单提交时重置文本。

Hope that helps.

希望有帮助。