javascript - 联系表格 7 现场标签

Question

我想知道是否有人可以帮助解决我在选择字段时表单标签不消失的问题？

我目前有一个 Wordpress 站点，我在其中使用 Contact Form 7 插件来创建表单。从那以后，我使用了一个 jQuery 代码片段来实现一些现场标签，但是由于某种原因，当我在字段中单击时，标签文本不会消失？

我究竟做错了什么？

http://alanbrandt.com/contact

请注意，如果这似乎是一个愚蠢的问题，我不是开发人员，非常抱歉。

希望有人可以帮忙？

谢谢！

回答：

这是解决方案...

jQuery(function(){
      $('#commentform')
  .on('mouseenter focus', 'input, textarea', function () {
      $(this).closest('p').find('label:first').css('opacity', 0.5)
  })
  .on('mouseleave focusout', 'input, textarea', function () {
      $(this).closest('p').find('label:first').css('opacity', 1)
  })
  .on('input', 'input', function (e) {
      var label = $(this).closest('p').find('label:first');
      e.target.value == '' ? label.show() : label.hide()
  });
});

Answer 1

Try this,

jQuery(function(){
    jQuery('form.wpcf7-form').on('keyup','input, textarea',function(){
       jQuery(this).closest('span').prev('label').css('opacity',0);
    });
});

Updated

jQuery(function(){
    jQuery('form.wpcf7-form').on('keyup','input, textarea',function(){
       var opaq=1;
       if($(this).val())
           opaq=0;// if something has written then opacity should be 0
       jQuery(this).closest('span').prev('label').css('opacity',opaq);
    });
});