根据显示的div更改img src
根据显示的.product-boxx，切换相应的step4img对应的src
因为.product-boxx一共有7个，所以最终的结果会有28款，就是需要切换28张图
<div class="container" id="finalform" style="display: flex;">
<img src="//cdn.shopify.com/s/files/1/0501/9775/8119/files/Banner.jpg?v=1663254286" id="step4img" class=" ls-is-cached lazyloaded">
<div class="flexboxxxxx">
<botton id="finaltopback" class="custombtn0">backbotton>
<botton id="fianlatc" class="custombtn1" onclick="adddd()">Add To Cartbotton> <a href=""
class="custombtn2">Start Overa>
div>
<div class="product-boxx" id="product-laptop" style="display:none;">
<p class="toptext">PRIMARY MOUNT OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Single Arm Laptop Stand(DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$79.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749446029479">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-monitor" style="display:none;">
<p class="toptext">PRIMARY MOUNT OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Single Arm Monitor Stand(DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$69.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749450616999">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-lapmon" style="">
<p class="toptext">PRIMARY MOUNT OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Dual Arm Stand for Laptop and Monitor(DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$99.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749457858727">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-monitor2" style="display:none;">
<p class="toptext">PRIMARY MOUNT OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Dual Arm Monitor Stand(DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$89.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749461004455">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-light" style="">
<p class="toptext">RING LIGHT OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">12“ Ring Light Set with Arm (DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$70.00 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749468639399">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-pad" style="">
<p class="toptext">TABLET HOLDER OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Tablet Holder with Arm(DZ)span>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$39.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749478699175">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<div class="product-boxx" id="product-micro" style="display:none;">
<p class="toptext">MICROPHONE ARM OF YOUR CHOICEp>
<div class="product-info">
<a href=" " target="_blank">
<span class="producttitle">Microphone Mount with Parallel Connectorspan>
a>
<p class="productdes">p>
div>
<p class="productquality">x 1p>
<p class="productprice">$39.99 USDp>
<form method="post" action="/cart/add">
<input type="hidden" name="id" value="42749487186087">
<input type="submit" value="Add to cart" class="atcbtn" style="opacity: 0;">
form>
div>
<hr align="center" width="100%" style="background:#000;height:1px;">
<div class="bottombox">
<div class="bottonbox">
<botton id="step4-back" class="custombtn0">backbotton> <a href="/cart" class="custombtn1"
target="_blank">View Cartsa> <a href="" class="custombtn2">Start Overa>
div>
<div class="pricebox">
<p class="total">Estimated total: $p> <input type="text" id="finalprice" disabled="">
<p class="totaltext">Estimated total does not include freight. The freight will be informed after you
provide the address.p>
div>
div>
div>
根据步骤2得到图片容器设置下步骤4的图片就行，改下setSum这个函数，如下
function setSum() {
/////图片设置
var step1option = $("input[name='equipment']:checked").val(), stepId;
switch (step1option) {
case 'laptop': stepId = 'step2-laptop'; break;
case 'monitor': stepId = 'step2-monitor'; break;
case 'laptopmonitor': stepId = 'step2-lapmoni'; break;
case 'monitormonitor': stepId = 'step2-monitor2'; break;
}
var src = $('#' + stepId).find('img.accessories-img').attr('src');
console.log(src)
$('#step4img').attr('src',src)
/////图片设置
var sum = 0;
$('#finalform .product-boxx:visible p.productprice').each(function () {
sum += parseFloat(this.innerText.substring(1));
});
sum = sum.toFixed(2);//保留2位小数，防止浮点数计算精度丢失
$('#finalprice').val(sum)
$('#fianlatc').unbind().click(async function () {
var btns = $('#finalform .product-boxx:visible input.atcbtn');
for (var i = 0; i < btns.length; i++) {
//await控制循序请求，2秒点一个按钮
await clickButton(btns.eq(i))
}
})
}