多个按钮调用相同的功能，执行不同的方法

本文关键字：执行 方法 功能 调用 按钮 | 更新日期: 2023-09-27 18:17:26

我有两个按钮调用同一个函数，btnUpdate必须执行这个函数，而btnsave不需要执行这个方法

<script type="text/javascript">
function Update_New() {
  if (document.getElementById("btnUpdate").value == 2) {
    var update_confrimation = confirm("Are you sure you want to Update?");
    if (update_confrimation == true) {
      return true;
    } else {
      return false;
    }
  }

按钮代码

 <asp:Button ID="btnSave" runat="server" Text="SAVE" OnClick="btnSave_Click" OnClientClick="return Update_New()" value="1" />
<asp:Button ID="btnUpdate" runat="server" Text="UPDATE" OnClick="btnUpdate_Click" OnClientClick="return Update_New() " value="2" /
当我点击更新时，没有任何动作发生我得到的问题是值在javascript中没有定义(@document.getElementById("btnUpdate").value)

多个按钮调用相同的功能，执行不同的方法

您可以在调用函数时将参数传递给函数，如下所示:

HTML:

<asp:Button ID="btnSave" runat="server" Text="SAVE" OnClick="btnSave_Click" OnClientClick="return Update_New(true)" value="1" />
<asp:Button ID="btnUpdate" runat="server" Text="UPDATE" OnClick="btnUpdate_Click" OnClientClick="return Update_New(false) " value="2" />
JavaScript:

<script type="text/javascript">
    function Update_New(isnew) {
        if (!isnew) {
            var update_confrimation = confirm("Are you sure you want to Update?");
            if (update_confrimation == true) {
                return true;
            }
            else {
                return false;
            }
        }
    }
</script>

注意:如果你想访问服务器控件，你可以访问它如下所述:

document.getElementById('<%=btnUpdate.ClientID%>').value;

你不能通过使用document.getElementById()直接在javascript中访问asp控件，你可以参考这个博客来实现

设置控件的ClientIDMode属性为以下值之一:

  1. AutoID
    2. 静态>
  2. 可预测的
例如:

<script type="text/javascript">
  var seasonalSports = new Array("None selected",
                                 "Tennis",
                                 "Volleyball",
                                 "Baseball",
                                 "Skiing");
  function DisplaySport(x) {
      document.getElementById("SelectedSport").innerHTML
      = seasonalSports[x];
  }    
</script>
<asp:DropDownList ID="DropDownList1" runat="server" 
                  onchange="DisplaySport(this.selectedIndex);">
  <asp:ListItem Value="Select a season"></asp:ListItem>
  <asp:ListItem Value="Spring"></asp:ListItem>
  <asp:ListItem Value="Summer"></asp:ListItem>
  <asp:ListItem Value="Autumn"></asp:ListItem>
  <asp:ListItem Value="Winter"></asp:ListItem>
</asp:DropDownList>
<br />
<asp:Label ID="SelectedSport" runat="server" ClientIDMode="Static">
</asp:Label>

将btnUpdate的ClientIDMode属性设置为Static

或

使用getElementById("<%=btnUpdate.ClientID%>")

即使你已经接受了一个答案，所有以上的答案都工作正常，但我添加这个是为了让你意识到你做了什么错误。根据你的共享标记，它是这样的:- 

<asp:Button ID="btnSave" runat="server" Text="SAVE" OnClick="btnSave_Click" OnClientClick="return Update_New()" value="1" />
<asp:Button ID="btnUpdate" runat="server" Text="UPDATE" OnClick="btnUpdate_Click" OnClientClick="return Update_New() " value="2" /

你在这里使用一个名为value的属性。Net服务器控件不识别此属性，请参阅此MSDN link按钮属性，即使您将其指定为自定义属性，但它仍然不会被渲染，因为按钮Text属性当被渲染为HTML时，它会变成value，因此存在冲突。在您的情况下，它将分别是Save/Update而不是1/2。

一个更好的方法是使用data-attribute，在那里您可以保存一些数据值供客户端使用。

<asp:Button ID="btnSave" runat="server" Text="SAVE" OnClick="btnSave_Click" OnClientClick="return Update_New()" data-attr="1" />
<asp:Button ID="btnUpdate" runat="server" Text="UPDATE" OnClick="btnUpdate_Click" OnClientClick="return Update_New()" data-attr="2" />
Javascript

<script type="text/javascript">
    function Update_New(obj) {
        if (obj != undefined) {
            if (obj.dataset.attr == 2) {
                var update_confrimation = confirm("Are you sure you want to Update?");
                if (update_confrimation == true) {
                    return true;
                }
                else {
                    return false;
                }
            }
        }
    }
</script>
相关文章：