如果在 woocommerce 字段中输入的值发生更改，如何调用函数答案

【问题标题】：How to call a function if the value entered in a woocommerce field changes如果在 woocommerce 字段中输入的值发生更改，如何调用函数
【发布时间】：2019-08-07 21:46:27
【问题描述】：

我们有一个使用 WooCommerce 的 WordPress 网站。我对 WooCommerce 非常缺乏经验。

在结帐页面的结算详情下，用户必须填写他们的名字和姓氏，以及他们的电子邮件地址。

如果这三个字段中的任何一个字段中的数据发生了变化，我需要调用一个函数。在这个函数中，我需要检查所有 3 个字段是否都已完成，然后我需要将信息发送到服务器。

如何连接到这 3 个字段的“onchange”事件？

我曾尝试使用“change_woocommerce_field_markup”添加一个可以触发事件的 HTML 元素，但到目前为止还没有成功。

我尝试将以下内容添加到页面上运行的 javascript 中，但从未触发该事件：

var email_field = $('#billing_email')
email_field.on('change', function () {
    console.log("email changed");
});

我尝试使用 woocommerce_form_field_ 过滤字段，但无法正常工作，也找不到明确的示例。

谁能告诉我如何将函数连接到名字、姓氏和电子邮件账单字段的更改事件？能否请您告诉我如何将数据输入到字段中？

【问题讨论】：

该代码看起来没问题，除了 'billing_email' 作为选择器不会选择任何东西。我假设您的意思是 '.billing_email'（如果是类）或 '#billing_email'（如果是 ID）
你也可以试试$("#billing_email").on('keyup', function(){ console.log(this.value); })或者`$(".billing_email").on('keyup', function(){ console.log(this.value); });`跨度>
@RobinZigmond 你是对的。它应该是“#billing_email”（我在问题中修复了它）。我用#（即'#billing_email'）尝试了它，但不幸的是事件仍然没有触发
@ImranKhan .on('keyup' 也没有触发
你可以试试这个<input type="text" onkeyup="handleChange(this)">然后在<script> function handleChange(el) {console.log($(el.val());)} </script>里面定义这个函数

标签： javascript php wordpress woocommerce

【解决方案1】：

$('#billing_email') 不起作用的原因是 JavaScript 在页面标题中排队，在 WooCommerce 为页面生成 HTML 之前。我通过使用

在页脚中排队 JavaScript 来修复它

add_action('wp_footer', 'my_php_function_that_enqueues_javascript');

在 PHP 后端。

【讨论】：