Javascript 在 Wordpress 中附加重复数据的插件

Question

我正在使用一个名为 curry.js that's being called on a custom Wordpress page 的货币转换插件，带有 bootstrap 选项卡和高级自定义字段。

当 WP 循环遍历每个选项卡时，它会附加到货币列表中，这样当您在第三个选项卡中打开下拉菜单时，您会看到重复三次的货币列表。

这里的代码部分 curry.js 每次都是运行：

var generateDDM = function( rates ){

        output = '';

        // Change all target elements to drop downs
        dropDownMenu.each(function(){

            for (var i in rates ) {

                rate = rates[i];

                output += '<option value="'+ i +'" data-rate="'+ rate +'">' + i + '</option>';

            }

            $( output ).appendTo( this );

        });

    };

我尝试在该代码块之外创建一个 counter 变量，以便在它运行一次并创建货币列表后，将该列表存储在全局 output 变量中不再追加，但无济于事。

如果需要进一步说明，我很乐意提供 - 任何帮助都将非常棒我已经花了很多时间试图解决这个问题，我知道这应该是一个非常简单的解决方案。

谢谢！

Answer 1

在javascript中，代码是异步执行的，这意味着不能保证仅在第一行代码执行后才执行第二行代码。所以也许这就是为什么 counter 变量值对全局 output 变量不可见的原因。有关详细信息，请参阅这篇精彩文章 Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference

Answer 2

通过检查每个 WP 循环后输出变量的长度的简单 if 语句解决了这个问题：

dropDownMenu.each(function(){
  if(output.length < 251) {
    for ( var i in rates ) {
      rate = rates[i];          
        output += '<option value="'+ i +'" data-rate="'+ rate +'">' + i + '</option>';
    }
    $( output ).appendTo( this );
  }
  else {
    $( output ).appendTo( this );
  }
});

Javascript 在 Wordpress 中附加重复数据的插件

Javascript plugin appending duplicate data in Wordpress

javascript

wordpress

jquery

advanced-custom-fields