隐藏和显示功能不断刷新页面

Question

我试图隐藏并显示按钮 每当我点击按钮，它的作品，但也刷新页面在同一时间。我不确定是什么导致刷新。这是在ASPX：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<script> 
$(document).ready(function() { 
    $("#buttontest").click(function() { 
     $("#hello").toggle(); 
    }); 
});</script> 

<button id="buttontest">test</button> 
<div id="hello">hello</div> 

不知道它的aspx.cs导致了令人耳目一新：

protected void Page_Load(object sender, EventArgs e) 
{ 
    SqlConnection myConnect = new SqlConnection(_connStr); 
    acct = new Account(); 
    acct = (Account)Session["Account"]; 


    if (!IsPostBack) 
    { 

     LoadCart(); 
     DataBind(); 

     string strCommandText = "SELECT * From Customer where Cust_Id = @Cust_Id"; 

     SqlCommand cmd = new SqlCommand(strCommandText, myConnect); 
     cmd.Parameters.AddWithValue("@Cust_Id", 1); 

     //open connection and retrieve data by calling ExecuteReader 
     myConnect.Open(); 
     SqlDataReader dr = cmd.ExecuteReader(); 

     if (dr.Read()) 
     { 

      Lbl_FName.Text = dr["First_Name"].ToString(); 
      Lbl_LName.Text = dr["Last_Name"].ToString(); 
      Lbl_CNo.Text = dr["Contact_No"].ToString(); 
      string addr1 = dr["Address"].ToString(); 
      string addr2 = dr["Address2"].ToString(); 

      address = new List<string>(); 
      address.Add(dr["Address"].ToString() + " " + "Singapore " + dr["Postal_Code"].ToString()); 
      address.Add(dr["Address2"].ToString() + " " + "Singapore " + dr["Postal_Code"].ToString()); 
      //Ddl_Address.Text = dr["Address"].ToString() + " " + "Singapore " + dr["Postal_Code"].ToString(); 
      //Ddl_Address.Text = dr["Address2"].ToString() + " " + "Singapore " + dr["Postal_Code"].ToString(); 


      ddl_Addr.DataSource = address; 
      ddl_Addr.DataBind(); 

     } 
     dr.Dispose(); 
     dr.Close(); 
     myConnect.Close(); 


     //page load box retrieve 
     SqlConnection myConnect2 = new SqlConnection(_connStr); 
     string strCommandText2 = "SELECT * From Card_Details where Card_Id = @Card_Id"; 
     myConnect2.Open(); 
     SqlCommand cmd2 = new SqlCommand(strCommandText2, myConnect2); 
     cmd2.Parameters.AddWithValue("@Card_Id", 1); 

     ////open connection and retrieve data by calling ExecuteReader 

     SqlDataReader dr2 = cmd2.ExecuteReader(); 


     if (dr2.Read()) 
     { 

      CNo1 = dr2["Card_Number"].ToString(); 
      CNo2 = dr2["Card_Number2"].ToString(); 
      Session["CardNo1"] = CNo1; 
      Session["CardNo2"] = CNo2; 

      CNo = new List<string>(); 
      CNo.Add(CNo1); 
      CNo.Add(CNo2); 

      ddl_CNo.DataSource = CNo; 
      ddl_CNo.DataBind(); 

      //display when first run 
      Lbl_CardName.Text = dr2["Name_On_Card"].ToString(); 
      Lbl_CardType.Text = dr2["Card_Type"].ToString(); 
      Lbl_EDate.Text = dr2["Expired_Date"].ToString(); 

      dr2.Dispose(); 
      dr2.Close(); 

      myConnect2.Close(); 
     } 

    } 
} 

protected void ddl_CNo_SelectedIndexChanged(object sender, EventArgs e) 
{ 

    string cardNum1 = Session["CardNo1"].ToString(); 
    string cardNum2 = Session["CardNo2"].ToString(); 


    if (ddl_CNo.SelectedIndex == 0) 
    { 
     SqlConnection myConnect2 = new SqlConnection(_connStr); 
     string strCommandText2 = "SELECT Name_On_Card, Card_Type, Expired_Date From Card_Details where Card_Number = @Card_Number"; 
     myConnect2.Open(); 
     SqlCommand cmd2 = new SqlCommand(strCommandText2, myConnect2); 
     cmd2.Parameters.AddWithValue("@Card_Number", cardNum1); 
     SqlDataReader dr2 = cmd2.ExecuteReader(); 

     if (dr2.Read()) 
     { 
       Lbl_CardName.Text = dr2["Name_On_Card"].ToString(); 
       Lbl_CardType.Text = dr2["Card_Type"].ToString(); 
       Lbl_EDate.Text = dr2["Expired_Date"].ToString(); 
      } 

      dr2.Dispose(); 
      dr2.Close(); 
      // DataBind(); 

      myConnect2.Close(); 
     } 

    else if (ddl_CNo.SelectedIndex == 1) 
    { 
      SqlConnection myConnect3 = new SqlConnection(_connStr); 
      string strCommandText3 = "SELECT Name_On_Card2, Card_Type2, Expired_Date2 From Card_Details where Card_Number2 = @Card_Number2"; 
     myConnect3.Open(); 
     SqlCommand cmd3 = new SqlCommand(strCommandText3, myConnect3); 
     cmd3.Parameters.AddWithValue("@Card_Number2", cardNum2); 
     SqlDataReader dr3 = cmd3.ExecuteReader(); 

     if (dr3.Read()) 
     { 
       Lbl_CardName.Text = dr3["Name_On_Card2"].ToString(); 
       Lbl_CardType.Text = dr3["Card_Type2"].ToString(); 
       Lbl_EDate.Text = dr3["Expired_Date2"].ToString(); 
      } 

      dr3.Dispose(); 
      dr3.Close(); 
      // DataBind(); 

      myConnect3.Close(); 
     } 

    } 



protected void LoadCart() 
{ 

    gv_CartView.DataSource = ShoppingCart.Instance.Items; 
    gv_CartView.DataBind(); 
    decimal total = 0.0m; 
    foreach (ShoppingCartItem item in ShoppingCart.Instance.Items) 
    { 
     total = total + item.TotalPrice; 
    } 
    decimal a = 2.0m; 
    decimal totalP = a + total; 
    Lbl_Subtotal.Text = total.ToString("C"); 



    Lbl_TotalPrice.Text = totalP.ToString("C"); 


} 

我还是不熟悉这一切，任何帮助，将不胜感激

编辑：我编辑了按钮和JavaScript，它仍然导致刷新

Answer 1

这看起来像你可能有按钮类型，提交其他明智的，这是不可能发生

请确保您添加按钮，按钮而不是提交按钮

也请尽量避免

$("button").click(function() {

使用特定的按钮ID

$("#btn_toggle").click(function() { 

你也可以做..如果你的按钮类型提交，但你需要做返回false。

$("#btn_toggle").click(function() { 
      $("#hello").toggle(); 
      return false; 
    }); 

但确保这将停止提交您的服务器。

Answer 2

用html按钮替换服务器按钮。即

更换

<asp:Button /> 

随着

<input type="button" /> 

OR

做到这一点：

$("button").click(function() { 
     $("#hello").toggle(); 
     return false; 
    }); 

Answer 3

Try this 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<script> 
$(document).ready(function() { 
    $("button").click(function() { 

     $("#hello").toggle(); 
    }); 
});</script> 

<button>hello</button> 
<div id="hello">hello</div>