在 jquery 表单序列化变量中设置 jquery 延迟
set jquery delay in jquery form serialize variable
这是我使用 ajax 在购物车中添加产品的简单代码,但是当用户点击太快时,某些产品不会添加到购物车中。在第一行,我在调用 ajax 后使用序列化从表单中获取数据并将产品添加到购物车中。现在给我解决方案,我可以在其中放置超时或延迟以及类似的东西,以便执行有时会停止。
var datas = form.serialize();
if(usefancy){
$.fancybox.showActivity();
}
$.getJSON(vmSiteurl+'index.php?option=com_virtuemart&nosef=1&view=cart&task=addJS&format=json'+vmLang,encodeURIComponent(datas),
function(datas, textStatus) {
if(datas.stat ==1){
var txt = datas.msg;
} else if(datas.stat ==2){
var txt = datas.msg +"<H4>"+form.find(".pname").val()+"</H4>";
} else {
var txt = "<H4>"+vmCartError+"</H4>"+datas.msg;
}
setTimeout(function(){
var datas = form.serialize();
}, 3000);
3000 相当于 3 秒(3000 毫秒)。
使用 setTimeout
是一种非常不可靠的变量更新方式(如果 jQuery 函数在 3 秒内无法执行怎么办?相反,您应该使用许多jQuery
函数中可用的callback
功能,并在该callback
函数中设置变量。
编辑:对于用户点击太快的问题,您必须实施一个简单的锁定机制,以便在将商品添加到购物车时,禁用"添加到购物车"选项。这可以按以下方式完成:
var cartLock = false; //means you can add items to cart
由于您需要捕获complete
的能力,因此我推荐以下方法,
$.ajax({
type: "GET",
url: url,
dataType: "json",
beforeSend: function(msg){
cartLock = true; // Just before calling
},
success: function(msg){
// your logic here
},
complete: function(){
cartLock = false; // After request completes
}
});
现在,您需要引入的最后一个检查是,只有在cartLock
false
时才会调用$.ajax()
。希望这是有道理的。
只需将其包装在一个函数中:
var datas = '';
setTimeout(function(){
datas=form.serialize();
},1000);
更好的方法
查找和事件,当用户完成添加产品(可能是单击的按钮或类似的东西)时触发,然后进行序列化和 ajax 调用。
假设您有一个带有id="sendProduct"的按钮
<button id="sendProduct">Send product</button>
您可以执行以下操作:
$("#sendProduct").click(function () {// Everytime user clicks "sendProduct" you will send info to the server.
var datas = form.serialize();
if (usefancy) {
$.fancybox.showActivity();
}
$.getJSON(vmSiteurl + 'index.php?option=com_virtuemart&nosef=1&view=cart&task=addJS&format=json' + vmLang, encodeURIComponent(datas),
function (datas, textStatus) {
if (datas.stat == 1) {
var txt = datas.msg;
} else if (datas.stat == 2) {
var txt = datas.msg + "<H4>" + form.find(".pname").val() + "</H4>";
} else {
var txt = "<H4>" + vmCartError + "</H4>" + datas.msg;
}
});
});
相关文章:
- jquery设置为使用参数运行
- Css order属性不't在Jquery设置时更新
- 通过jquery设置最小高度
- 使用jQuery设置HTML5属性值时出现问题
- 如何使用Ajax/jQuery设置cookie
- 通过jQuery设置转换值
- 如何从jQuery设置控制器或全局变量的属性
- javascript/jquery设置var未发生
- jQuery 设置和获取下拉列表和输入的本地存储数据
- 如何使用 jQuery 设置 .selectedIndex
- 使用 jquery 设置 Asp Label 控件的文本值
- 无法从jquery设置标签文本
- 如何使用Jquery设置按钮样式
- jQuery设置属性onclick所有元素,而不是使用内联JS
- 尝试使用jquery设置鼠标按下的时间来更改按钮触发器以控制音量滑块
- 无法使用jquery设置cookie
- 有没有一种快捷方式可以让我用javascript或jQuery设置对象的字段
- 使用Jquery设置页面加载的默认值(我使用的是multiselect插件)
- 单击JQuery设置布尔标志
- textarea根据内容js或jquery设置高度