javascript页面加载发生在Button Click上

javascript page Load occurs on Button Click

本文关键字：Button Click 加载 javascript      更新时间：2023-09-26

我的问题是，当我点击id="cmdAddATM"的按钮时，整个.aspx页面都重新加载了。尽管我没有写任何与之相关的点击函数。问题是什么？因为这个问题在我的项目中引发了一些与ajax/jquery 相关的新问题

文件名：AddEditATM.aspx.cs

namespace Monitoring_Tool
{
    public partial class AddEditATM : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Generix.fillDropDown(ref litRegion, Generix.getData("dbo.Region", "REGION, Code", "", "", "Code", 1));
        }
    }
}

文件：AddEditATM.aspx

<script language="javascript" type="text/javascript">
    $(document).ready(function() {
        showAddEditATMLoad();
    });
</script>
<body>
// I an not writing full syntax here but i have one button with id "cmdAddATM"
</body>

外部JS文件：

function showAddEditATMLoad() { 
    //Its Blank
}

我的HTML代码：-

<table style="margin: 0px auto; width: 90%" runat="server">
  <thead>
      <tr>
          <th colspan="4" align="center" class="ui-widget-header PageHeader">
              ADD/EDIT ATM
          </th>
      </tr>
  </thead>
  <tbody style="vertical-align: bottom; border-style: solid; border-width: thick;">
      <tr>
          <td style="padding-left: 5px" colspan="2">
              Enter ATM ID &nbsp;<input id="txtEditATM" name="txtEditATM" type="text" />
              &nbsp;&nbsp;
              <button id="cmdEditATM">
                  EDIT ATM</button>
          </td>
          <td align="left" style="font-weight: bold" colspan="1">
              OR
          </td>
          <td align="center" colspan="2">
              <button id="cmdAddATM">
                  ADD ATM</button>
          </td>
      </tr>
  </tbody>
</table>

如果您的按钮是<asp:Button runat="server" />，它将在浏览器上呈现为<input type="submit" />。所以，它会回发你的页面。

编辑：添加带有<button>标签的type="button"属性，<button>标签的type属性有三个值，在您的情况下，标签得到的默认值是submit，这就是它提交表单的原因。

1. Submit - For Submitting a Form
2. Reset - For Resetting the Form
3. button - A Simple Button

向<button>标记添加类型属性。

<button id="cmdEditATM" type='button'>EDIT ATM</button>

SO线程

  1. vs.使用哪一个
  2. input type="submit"与按钮标签可以互换吗

如果使用asp:Button对象，可以使用OnClientClick属性或仅使用jQuery来运行一些客户端代码。您可以从javascript点击事件处理程序中返回false（或使用jQuery的event.preventDefault()方法）来停止回发。

如果您从不希望此按钮发生回发，请使用普通的HTML按钮（<input type="button" ... />）。如果你需要访问服务器端的这个按钮，只需添加普通的runat="server"属性即可

请注意，HTML <input type="submit"/>按钮将导致回发，因为它将在页面上提交表单。

将type="button"属性添加到按钮中。不同的浏览器可以对button元素使用不同的默认类型。

在asp.net中，如果您添加任何asp按钮，它会自动将asp按钮转换为提交按钮，因此将asp按钮替换为HTML按钮

<input type="button" id='cmdAddATM' value="Button" />
相关文章：