如何在Contact Form7中向文本输入添加“On Change”？

时间：2020-12-12 作者：Zaki

我正在将静态主题转换为wp主题，并使用wpcf7插件处理表单。我想知道如何使用wpcf7文本标记编写此代码。

<input type="text" name="name" id="name" value="" onchange="this.setAttribute(\'value\',this.value);" required/>
我所能做的就是

[text* name id:name]
我的问题是如何将onchange添加到此文本输入中？

1 个回复
SO网友:Aurovrata

CF7插件不允许您访问字段标记的HTML标记格式功能。因此，您需要捕获字段更改时激发的JavaScript事件。为此，您可以在表单末尾标记脚本，

<label>[text* name id:name]</label>
<label>[text* surname id:surname]</label>
[submit]
<script>
(function($){
\'use strict\';
  $(document).ready( function(){
    $(\'form.wpcf7-form :input\').change(function(e){
      var $field = $(e.target);
      switch($field.attr(\'name\')){
        case \'name\': //text field name was changed.
          //do something.
          break;
        case \'surname\': //text field surname was changed.
          //do something.
          break;
      }
    })
  })
})(jQuery)
</script>

标签： javascript   forms   plugin-contact-form-7   input   小码农  

相关推荐

Defer parsing of JavaScript

当我测试网站的页面速度时(https://sunshineecocleaningservices.com.au/) 延迟解析JavaScript的得分为0“在初始页面加载期间解析了3.6MiB的JavaScript。延迟解析JavaScript以减少页面呈现的阻塞。”虽然JS缩小了。如何解决此问题？有没有插件什么的。