如何根据 jQuery 中设置的 cookie 值更改元素而不重新加载页面？

Question

好的，所以我对 jQuery 非常了解，我编写的代码无疑效率低下，但它在一定程度上起作用。

我有一个表格，客户可以在其中选择“企业”或“个人”，并在提交时设置一个 cookie...如果用户选择了“企业”，我想触发图像更改，但是要进行更改要使页面生效，需要重新加载。我如何在选择选项时触发它？

$(document).ready(function(){
$("#thankyoumessage").css("display","none");
            
    $(".storagetype").click(function(){
        if ($('input[name=customertype]:checked').val() == "Personal" ) {
            $("#thankyoumessage").slideDown("fast"); //Slide Down Effect
            $.cookie('customerIs', 'personal_cust', { path: '/', domain: 'storebox.co.uk'});   
if ("ga" in window) {
    tracker = ga.getAll()[0];
    if (tracker)
        tracker.send("event", "customer_type", "Personal");
};         
        } else if ($('input[name=customertype]:checked').val() == "Business" ) {
            $("#thankyoumessage").slideDown("fast"); //Slide Down Effect
            $.cookie('customerIs', 'business_cust', { path: '/', domain: 'storebox.co.uk'});   
if ("ga" in window) {
    tracker = ga.getAll()[0];
    if (tracker)
        tracker.send("event", "customer_type", "Business");
};          
        } else {
            $("#thankyoumessage").slideUp("fast");  //Slide Up Effect
        }
     });  
     
      var customerIs = $.cookie('customerIs');  
     
      if (customerIs == 'personal_cust' || customerIs == 'business_cust') {  
        
        $("#customerTypeForm").css("display","none"); 
        

      };
        
        var customerIs = $.cookie('customerIs');
if (customerIs == 'business_cust') {  
        
        $('li.unit:nth-of-type(1) .unit__img-wrap img').attr('src', 'https://www.storebox.co.uk/wp-content/uploads/2021/06/unit-small-trade.png');
        $('li.unit:nth-of-type(2) .unit__img-wrap img').attr('src', 'https://www.storebox.co.uk/wp-content/uploads/2021/06/unit-medium-trade.png');
        $('li.unit:nth-of-type(3) .unit__img-wrap img').attr('src', 'https://www.storebox.co.uk/wp-content/uploads/2021/06/unit-large-trade.png');
        

      };
          
});

提前致谢

Answer 1

回答我在评论中的内容，这样您就可以将问题标记为已解决 ;)

You can copy paste the "src" changes that you have at the end of your code inside " else if ($('input[name=customertype]:checked').val() == "Business" ) "

Keep both parts, and once you are on the page for the first time it changes it with the first part and on all the following times it will be changed based on the cookie.

如何根据 jQuery 中设置的 cookie 值更改元素而不重新加载页面？

How do i change an element based on cookie value set in jQuery without reloading the page?

javascript

cookies

jquery

dynamic