为什么我的按钮点击多次执行?

时间:2017-07-29 06:13:18

标签: javascript c# jquery ajax web-services

我已经编写了这个ajax代码来将数据发送到web服务asmx。它可以工作,但只需单击一下,它就会多次插入数据,有时需要2,3次点击才能插入数据。

的.js

 <script type="text/javascript">

            function save()
            {
                $("button").click
                (
                     function()
                     {
                        $.post
                        (
                            "http://localhost:82/ws/himher.asmx/InsertUsers",
                            {name: txtUserName.value, pwd: txtUserPwd.value},
//                          
                        );

                     }
                );
            }



        </script>
    </head>
<body> 
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                 <label>User Name</label>
                 <input id="txtUserName" type="text" class="form-control" />
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                 <label>Password</label>
                 <input id="txtUserPwd" type="text" class="form-control" />
            </div>
        </div>    
        <br/>
         <div class="row">
            <div class="col-md-12">     
                 <button type="submit" onclick='save()' class="btn btn-primary pull-right">Register</button>
            </div>
        </div>    
    </div>

的.cs:

public class himher : System.Web.Services.WebService
{

    [WebMethod(EnableSession = true)]
    //[ScriptMethod(UseHttpGet = false)]
    public string InsertUsers(string name, string pwd)
    {
        try
        {
            basicoperation bop = new basicoperation();
            return bop.insertUsers(name, pwd);
        }
        catch (Exception ex)
        {

            throw ex;
        }


    }


    public string insertUsers(string Name, string Password)
    {
            string status;

            String ConStr = ConfigurationManager.ConnectionStrings["ConStr"].ConnectionString;

            SqlConnection sqlCon = new SqlConnection(ConStr);    // to make a connection with DB 

            SqlCommand sqlCom = new SqlCommand("InsertUsers", sqlCon); // now in order to perform action such as insert SP, we must create command object which needs command name and conncetion only

            sqlCom.CommandType = CommandType.StoredProcedure;  // you must tell the system that insertInfo is a storedprocedure 

            SqlParameter sqlParamName = new SqlParameter("@UserName", Name);
            SqlParameter sqlParamPwd= new SqlParameter("@Password", Password);

            sqlCom.Parameters.Add(sqlParamName);
            sqlCom.Parameters.Add(sqlParamPwd);      

            try
            {
                sqlCon.Open();

               int i= sqlCom.ExecuteNonQuery();   // executenonquery is used for INSERT, UPDATE, DELETE 

                //sqlCom.ExecuteScalar();   // used to pick or read a single value from procedure
               // Response.Write("Done");

                sqlCon.Close();

                status= "Success";
            }
            catch (Exception ex)
            {
                //response.Write(ex.Message);
                status = ex.Message;
            }
        return status;
    }
}

2 个答案:

答案 0 :(得分:2)

你有一个保存功能的绑定,当你点击按钮时,其中一个绑定。像这样重写你的JS:

<script type="text/javascript">
    function save()
    {
        $.post(
            "http://localhost:82/ws/himher.asmx/InsertUsers",
            {name: txtUserName.value, pwd: txtUserPwd.value}
        );
    }
</script>

这样,您的save功能将只执行 保存逻辑。 绑定来调用此函数是通过<button type="submit" onclick='save()'>以HTML格式完成的。

答案 1 :(得分:0)

如果您要向用户发布此代码,您确实需要实施一些重复的操作预防,而不是希望他们只需单击一次。虽然你可能会发现它为什么会插入倍数,但是你不能依赖用户行为来防止垃圾进出数据库;他们会慢慢走下去,沮丧地按下那个按钮。即使您禁用该按钮,他们也会刷新并再次提交。在插入之前重复数据 - 这是多层信息安全;即使他们禁用了阻止他们敲击按钮的脚本,你也不会接受重复的内容

注意,我不会将此作为真正的解决方案提供#34;我点击此一次并插入3个数据&#34; - 确定该错误,但在服务器内(您完全控制的地方)控制用户对数据纯度的期望行为