Question

这可能是基本的，但这个问题花了我几个小时才弄清楚，我没有找到任何解决方案。我正在使用Wordpress 3.5，我在这个文件夹中有一个名为general.js的外部javascript文件：wp-content / themes / [folder_name] / js。在general.js中，我编写了一个名为hideError的函数，基本上是为了隐藏从我的文本框中弹出的错误标签。

(function($) {
function hideErrorLabel(i) {
    //codes for handling label
}
})(jQuery);

我这样称呼它：

<span class="component-wrapper" onmouseover="hideErrorLabel(0)">
    <input type="text" name="txtName" size="10" />
    <label for="txtName" class="error">All field must be filled.</label>
</span>

我传递一个参数，因为这些文本框是数组。奇怪的是，它给了我javascript错误“hideErrorLabel未定义”。什么地方出了错？请帮忙。

Answer 1

(function($) {
 /* code */
})(jQuery);

将确保在解析DOM之后执行您提供的/* code */。但是，这会阻止在解析器尝试插入hideErrorLabel属性时定义onmouseover。

为了解决此问题，您应该在/* code */部分使用修改事件处理程序：

(function($) {
function hideErrorLabel(i) {
    //codes for handling label
}

$('.component-wrapper').on('mouseover',hideErrorlabel);
})(jQuery);

Answer 2

只需删除该javascript代码的第一行和最后一行即可。你隐藏了你的功能！在任何脚本标记中公开声明它。

<script type="text/javascript>
function hideErrorLabel(i) {
  //codes for handling label
}
</script>

Answer 3

有几个原因可能会发生，最安全的答案并不是最简单的将事件绑定移动到代码中。您也可以使用委托，如果您只是想查找函数的范围，则不需要索引。如果确实需要索引，则可以隐式获取位置，或使用数据集值通过PHP显式提供。

听起来你只需要：

(function($) {
  $(function() {
    $(document).on('mouseover', '.component-wrapper', function(event) {
      var $wrapper = $(event.currentTarget);
      $wrapper.find('.error').hide();
    });
  });
})(jQuery);

但您可以根据需要调整它以调用外部函数或提供额外的逻辑。

无法在wordpress中调用javascript函数

3 个答案: