我怎么能用javascript编写这个简短的函数？

So I have this code written using jquery, of which is a familiar language for me. However, I have not been able to successfully convert this to a javascript, not using jquery. Any help would be much appreciated!

所以我使用jquery编写了这段代码，对我来说这是一种熟悉的语言。但是，我无法成功将其转换为javascript，而不是使用jquery。任何帮助将非常感激！

// Toggle Function
$('.toggle').click(function(){
  // Switches the Icon
  $(this).children('i').toggleClass('fa-pencil');
  // Switches the forms  
  $('.form').animate({
    height: "toggle",
    'padding-top': 'toggle',
    'padding-bottom': 'toggle',
    opacity: "toggle"
  }, "slow");
});

This code switched the icons and forms for my login page.

此代码切换了我的登录页面的图标和表单。

Any tips would be very helpful, thanks for everything!

任何提示都会非常有用，谢谢你的一切！

1 个解决方案

#1

Here's a rough conversion into native JavaScript. You'll need to provide the CSS ".show" definition and possibly define some CSS animations there to get whatever animation you want.

这是对原生JavaScript的粗略转换。您需要提供CSS“.show”定义，并可能在那里定义一些CSS动画以获得您想要的任何动画。

const toggleElement = document.querySelector('.toggle');

toggleElement.addEventListener('click', function() {
    const icons = this.querySelectorAll('i');
    icons.forEach(iconElement => iconElement.classList.toggle('fa-pencil'));

    const form = document.querySelector('.form');
    form.classList.toggle('show');
}, false);

1 个解决方案

#1

更多相关文章

随机推荐