如何调用一个javascript函数当一个按钮在html表被点击

How to call a javascript function when a button inside html table is clicked?

本文关键字:一个 html 按钮 javascript 何调用 调用 函数      更新时间:2023-09-26

更新Sir Anmarti您好,先生,谢谢您回答我的问题我将这段代码添加到

page_load

string eventTarget = this.Request["__EVENTTARGET"];
        if (eventTarget == "DeleteRecord")
        {
            Label1.Text = "Method called!!!";
            // Delete your record here
        }else
        {
            Label1.Text = "No method";
        }

在页面加载(运行时)时,label1将其文本更改为"No method"

然后我点击按钮,然后弹出窗口。我选择了YES按钮,但是什么也没发生,它甚至没有关闭弹出窗口

为了检查javascript是否正常工作,我更改了以下代码
__doPostBack("DeleteRecord"、");来$("[id * = btnadd]").click ();

,点击弹出的是按钮后,点击按钮BTNADD

我的问题是为什么__doPostBack("DeleteRecord", ");对我没用吗?我甚至尝试了一些张贴在网上的教程,但它仍然是相同的


这是javascript函数:
    <script type="text/javascript">
   $(function () {
       //$("[id*=btnDelete]").removeAttr("onclick");
       $("[id*=btnDelete]").removeAttr("onclick");
       $("#dialog").dialog({
           modal: true,
           autoOpen: false,
           title: "Confirmation",
           width: 350,
           height: 160,
           buttons: [
           {
               id: "Yes",
               text: "Yes",
               click: function () {
                   $("[id*=btnDelete]").attr("rel", "delete");
                   $("[id*=btnDelete]").click();
               }
           },
           {
               id: "No",
               text: "No",
               click: function () {
                   $(this).dialog('close');
               }
           }
           ]
       });
       $("[id*=btnDelete]").click(function () {
           if ($(this).attr("rel") != "delete") {
               $('#dialog').dialog('open');
               return false;
           } else {
               __doPostBack(this.name, '');
           }
       });
   });
</script>
下面是 后面的代码
    protected void DeleteRecord(object sender, EventArgs e)
    {
        ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('Record Deleted.')", true);
    }

Html代码

<asp:Button ID="btnDelete" runat="server" Text="Delete" OnClick="DeleteRecord" UseSubmitBehavior="false" />
    <div id="dialog" style="display: none">
       Do you want to delete this record?
    </div>

效果很好

但是我如何在HTML表

中调用函数
<tr>
   <td>
      <%# DataBinder.Eval(Container.DataItem, "signatoryid") %> 
   </td>
   <td>
      <%# DataBinder.Eval(Container.DataItem, "signatoryname") %> 
   </td>
   <td>
      <%# DataBinder.Eval(Container.DataItem, "signatoryPosition") %> 
   </td>
   <td>
      <%# DataBinder.Eval(Container.DataItem, "signatoryOffice") %> 
   </td>
   <td>
      <button type="button" class="btndelete btn btn-xs btn-danger" OnClick="DeleteRecord">
      <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>Delete
      </button>
   </td>
</tr>          

客户端

创建一个打开对话框的函数,并在onClick事件中调用它:

 <button type="button" class="btndelete btn btn-xs btn-danger" OnClick="javascript:deleteRecord();">
     <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>Delete
  </button>

<script>
  $(function () {
     $("#dialog").dialog({
        modal: true,
        autoOpen: false,
        title: "Confirmation",
        width: 350,
        height: 160,
        buttons: [
        {
            id: "Yes",
            text: "Yes",
            click: function () {
                 __doPostBack("DeleteRecord", '');
            }
        },
        {
            id: "No",
            text: "No",
            click: function () {
                $(this).dialog('close');
                return false;
            }
        }
        ]
     });
});
    function deleteRecord(){
        $("#dialog").dialog('open');
    }
 </script>

服务器端代码

如果你做一个手工制作的__doPostback(),你必须检索Page_Load()Page_Init()上的EventTargetEventArguments(如果你有),如果你喜欢,当前页面的事件处理程序:

 protected void Page_Load(object sender, EventArgs e)
    {
      string eventTarget = this.Request["__EVENTTARGET"];
      if(eventTarget == "DeleteRecord")
      {
       // Delete your record here
      }
  }