jQuery的$。阿贾克斯（）执行两次？ [英] jQuery $.ajax() executed twice?

问题描述

下面是一个按钮：

 ＆LT;输入类型=按钮值=放入购物车ID =addToCart/＆GT;
 

和绑定的事件：

  $（＃addToCart）。绑定（点击，函数（）{
                $阿贾克斯（{
                    网址：'/ cartManager / ADD，
                    数据：{
                        pictureId：currentImageId，
                        printSize：$（＃大小选项：选择）VAL（）。
                        paperType：$（＃paperType选项：选择）VAL（）。
                        数量：1
                    }，
                    成功：函数（）{
                        $（＃模式）HTML（＆LT; H1＆GT;ОК＆LT; / H1＆GT;＆LT; P＆GT;关闭在几秒钟之内＆LT; / P＆gt;中）。延迟（1000）;
                        $（＃模式）覆盖（）close（）方法。;

                    }
                }）;
            返回false;
            }）;
 

和一切正常发现除了一件事是一种什么麻烦事了，我看到在Chrome dev的控制台两个请求对这样的：

1. 添加/ cartManager：

 请求的URL：http：//127.0.0.1：8000 / cartManager /加pictureId = 4和printSize = 2及paperType = 1＆安培;数量= 1
请求方法：GET
状态code：301被永久移动
 

1. 添加/ cartManager /添加：

 请求URL:http://127.0.0.1:8000/cartManager/add/?pictureId=4&printSize=2&paperType=1&quantity=1
请求方法：GET
状态code：201 CREATED
 

请求头两个是pretty的大同小异，在请求头的唯一区别：

首先是 cartManager /加pictureId = 等，第二个是 cartManager /添加/ pictureId - ？的/后/添加

是不是有什么毛病我的JavaScript？

解决方案

没什么每本身错了，但你应该添加结尾的斜线，以 / cartManager /添加自己

这是怎么回事是Web服务器发送一个 301 重定向到了AJAX客户端与一个新的URL，所以它发出一个新的请求到适当的URL（即用后面的斜杠）。

Here is a button:

<input type="button" value="add to cart" id="addToCart" />

and a bound event:

$("#addToCart").bind('click',function(){
                $.ajax({
                    url: '/cartManager/add',
                    data:{
                        pictureId: currentImageId,
                        printSize: $("#size option:selected").val(),
                        paperType: $("#paperType option:selected").val(),
                        quantity: 1
                    },
                    success: function(){
                        $("#modal").html("<h1>ОК</h1><p>Closing in a sec</p>").delay(1000);
                        $("#modal").overlay().close();

                    }
                });
            return false;
            });

And everything works find apart one thing that kind of bothers, I see two requests in Chrome dev console for this:

1. add /cartManager:

Request URL:http://127.0.0.1:8000/cartManager/add?pictureId=4&printSize=2&paperType=1&quantity=1
Request Method:GET
Status Code:301 MOVED PERMANENTLY

1. add /cartManager/add?:

Request URL:http://127.0.0.1:8000/cartManager/add/?pictureId=4&printSize=2&paperType=1&quantity=1
Request Method:GET
Status Code:201 CREATED

Request headers for both are pretty much the same, the only difference in request headers:

first is cartManager/add?pictureId= and so on and the second one is cartManager/add/?pictureId - the '/' after /add

Is there something wrong with my javascript?

解决方案

There's nothing wrong per-se, but you should add the trailing slash to /cartManager/add yourself.

What's happening is that the web server is sending a 301 redirect to the AJAX client with a new URL, so it issues a new request to the proper URL (i.e. with the trailing slash).

这篇关于jQuery的$。阿贾克斯（）执行两次？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！