Question

我在按钮点击时向php页面发送ajax请求。这是我的请求发送

$("#enteruser").on('click',function(){
console.log("entered here");
var name=$("#ename").val();
var email=$("#eemail").val();
var role=$("#erole").val();

var data={name: name, email:email, role:role};
var url='addemployee.php';

 $.ajax({
     url : url,
     data: data,
     type: 'POST',
     success: function(response)
     {
         if(response=="success")
             {
             $("#rmsg").text("Hello World");
             }
         else
             {

             }

     }
 });

});

我的这一行无效，返回后的网址包含我发送的值。因此，如果我重新发送请求，则由于url而不再发送请求。如果我把以下行

window.location="anotherpage.html"; in the success block the page is redirected to the that page. Then why the rmsg paragraph is not being written?

我正在使用以下代码动态添加表单

$("#create").on('click',function(){
var htmc='<div class="testbox">\n\
    <h1>Create Employee</h1>\n\
      <form>\n\
          <hr>\n\
      <label id="icon" for="eemail"><i class="icon-envelope "></i></label>\n\
      <input type="text" name="eemail" id="eemail" placeholder="Email" required/>\n\
      <label id="icon" for="ename"><i class="icon-user"></i></label>\n\
      <input type="text" name="ename" id="ename" placeholder="Name" required/>\n\
      <label id="icon" for="erole"><i class="icon-road"></i></label>\n\
      <input type="text" name="erole" id="erole" placeholder="Role" required/>\n\
       <button id="enteruser" class="button">Enter</button>\n\
      </form>\n\
    </div>';
$("#view").html(htmc);
});

$(document).on("#enteruser",'click',function(e){
    e.preventDefault();
    console.log("entered here");
var name=$("#ename").val();
var email=$("#eemail").val();
var role=$("#erole").val();

var data={name: name, email:email, role:role};
var url='addemployee.php';

 $.ajax({
     url : url,
     data: data,
     type: 'POST',
     success: function(response)
     {
         if(response=="success")
             {

             alert(response);
             $("#rmsg").text("Hello World");
             }
         else
             {

             }

     }
 });

});

Answer 1

在对HTTP调用进行故障排除时，我喜欢做的一件事是在调试工具中查看实际的网络事件。

在Google Chrome中，使用CTRL + SHIFT + I打开调试工具。然后单击Network选项卡。在这里，您可以查看POST和响应，并验证您的响应是否正确。

在MS IE中，您可以按F12查看那里的开发者工具

Answer 2

您没有阻止表单的默认行为。你应该对你的应用说：“对表格不做任何事情并由js处理”。你也在以错误的方式使用委托功能。

为此，请更改此内容：

$("#enteruser").on('click',function(){
console.log("entered here");

到此：

$("#enteruser").click(function(e){
e.preventDefault();
console.log("entered here");

如果表单从头开始在dom中，代码的所有其他部分都可以保留为现在。

$(document).on('click',"#enteruser",function(e){
e.preventDefault();
console.log("entered here");

如果表单在加载后添加到页面中。你也可以用dom结构中表单之前的页面中的任何元素替换文档

Answer 3

试试这个

System.exit(exitCode)

<强> PHP：

    <html>
    <head>

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

    </head>

    <body>

    <input type="text" id="ename" />
    <input type="text" id="eemail" />
    <input type="text" id="erole" />
    <span id="rmsg"></span>

    <button id="enteruser">Button</button>

    <script type="text/javascript">

    $("#enteruser").on('click',function(){

    console.log("entered here");
    var name=$("#ename").val();
    var email=$("#eemail").val();
    var role=$("#erole").val();

    var data={name: name, email:email, role:role};
    var url='addemployee.php';

     $.ajax({
         url : url, 
         data: data,
         type: 'POST',
         success: function(response)
         {
             if(response=="success")
                 {
                 $("#rmsg").text("Hello World");
                 }
             else
                 {

                 }

         }
     });
    });


    </script>

    </body>
    </html>

ajax请求不起作用？

3 个答案: