gpt4 book ai didi

javascript - 当按下按钮并且页面发生变化时执行完整的js函数

转载 作者:行者123 更新时间:2023-12-01 00:56:20 24 4
gpt4 key购买 nike

我有一个 html 页面,其中包含一个“添加到购物车”按钮。单击此按钮后,页面将重新路由到购物车。

<button type="submit" name="add" class="action_button add_to_cart" onclick="return postScreenShot()" data-label="Add to Cart"><span class="text">Add to Cart</span></button>

我需要发生的是,当用户单击此按钮时,将执行方法 postScreenShot

postscreenShot 方法包含:

function postScreenShot() {
'https://example.com/'+previewImageId+'.png');
var productName = $(".product_name").text();
var customText = $("#user_input").val();
var secondCustomText = $("#second_user_input").val();
var getImage = $("#img_preview_fancybox div").find("img").attr("src");
var licensePlateImage = getImage.replace('https://example.com/preview/img/','');

$.ajax({
type: 'POST',
data: {
firstLine: customText,
secondLine: secondCustomText,
previewId: previewImageId,
prodName: productName
},
url: 'https://example.com/doit',
});
}

我需要的是运行整个方法,但似乎发生的问题是页面在方法完成之前重新路由。

我所做的就是把它放在这里,期望它运行我的方法并等待它返回。

onClick="return postScreenShot()"

执行此操作的正确方法是什么,或者不可能?

最佳答案

POST 完成后,您可以使用 done 回调进行导航。

<button ... onclick="postScreenShot(event)">
function postScreenShot(event) {
event.preventDefault(); // <-- prevent default action

'https://example.com/'+previewImageId+'.png');
var productName = $(".product_name").text();
var customText = $("#user_input").val();
var secondCustomText = $("#second_user_input").val();
var getImage = $("#img_preview_fancybox div").find("img").attr("src");
var licensePlateImage = getImage.replace('https://example.com/preview/img/','');


$.ajax({
type: 'POST',
data: {firstLine: customText,
secondLine: secondCustomText,
previewId: previewImageId,
prodName: productName
},
url: 'https://example.com/doit',
}).done(function () { $("#form-selector").submit(); }); // <-- submit the form on done
};

关于javascript - 当按下按钮并且页面发生变化时执行完整的js函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56553246/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com