提交后属性前后的Ajax更改

Posted 2023-05-08

【中文标题】提交后属性前后的Ajax更改

【英文标题】：Ajax change before and after property after submit

【发布时间】：2021-12-25 10:37:40

【问题描述】：

我在 Laravel 中使用 Ajax 时事通讯提交。 如果数据成功通过，我想将邮件图标更改为选中图标。

阿贾克斯：

success: function (json) 
        
   container.find('.newsletter-notification').addClass('success').html("You've successfully subscribed to Newsletter.");
   $('.newsletter-block .newsletter-content .content button:before').css('content', '\e080');
        
,

css

.newsletter-block .newsletter-content .content button:before

  content: "\e01f";
  font-family: 'simple-line-icons';

如何将 content: "\e01f" 更改为 content: "\e080"

【问题讨论】：

来自javascript tag info：“[JavaScript] 与 Java 编程语言无关，只有表面上的相似之处。...”

创建两个不同的 css 类，每个状态一个，然后交换元素中的类。将所有样式都放在 css 中，而不是在 css 中和在 js 中。

如何从上面的js代码中删除类content

这能回答你的问题吗？ Add and remove multiple classes in jQuery

【参考方案1】：

试试这个 CSS

.newsletter-block .newsletter-content .content button:before

  content: "\e01f";
  font-family: 'simple-line-icons';


.newsletter-block .newsletter-content .content button.success:before

  content: "\e080";
  font-family: 'simple-line-icons';

Javascript

success: function (json) 
    var = newsLetterBtn = $('.newsletter-block .newsletter-content .content button');
    container.find('.newsletter-notification').addClass('success').html("You've successfully subscribed to Newsletter.");
    newsLetterBtn.addClass('success');
,