Javascript函数仅适用于一个变量

时间:2013-08-16 14:36:31

标签: javascript jquery function variables

我正在制作一个插件,但它现在可以工作一半。问题是我从复选框中获取了一些变量,但该函数只能在复选框的最后一个选中项目(列表中)上工作,而不能用于其他复选项。

我的代码:

jQuery(document).ready(function(){

  jQuery('#gap-filtedit input[type=button]').click(function(){
    jQuery('.filter-checkbox:checked').each(function() {
      getchecked = jQuery(this).data('rel');

      val = '[gap ';
      console.log(getchecked);

      jQuery('.' + getchecked).each(function(){
        val = val + getchecked + '=';
        name = jQuery(this).find('label').data('id');
        title = jQuery(this).find('input[type=text],select').val();

        if (!title) title = '';
        if (name != 'null') {

          val = val + name + ':' + title + ', ';

        }
      });
    });


    window.send_to_editor( val );
  });
});

日志将为我提供所选的选项。但是console.log之后的函数仅适用于行中选定的最后一个。

如何使该功能适用​​于每个选定的项目?

2 个答案:

答案 0 :(得分:2)

在.each语句中执行该功能:

jQuery(document).ready(function(){

        jQuery('#gap-filtedit input[type=button]').click(function(){
            jQuery('.filter-checkbox:checked').each(function() {
                    getchecked = jQuery(this).data('rel');

            val = '[gap ';
            console.log(getchecked);

jQuery('.' + getchecked).each(function(){   
        val = val + getchecked + '=';                      
        name = jQuery(this).find('label').data('id');
        title = jQuery(this).find('input[type=text],select').val();     

                    if (!title) title = '';
                        if (name != 'null') {

                val = val + name + ':' + title + ', ';
                window.send_to_editor( val );

                            }
                        });
                    });



                });
            });

答案 1 :(得分:1)

在循环复选框时

val = '[gap '; // setting the value

循环播放您要追加的表单字段

...
val = val + getchecked + '='; // appending
...
val = val + name + ':' + title + ', '; // appending
...

现在当内循环结束并返回外循环时,你的val被设置回[gap(基本上删除最后一个内循环追加)

解决方案是在click函数中声明变量并在第一个循环中追加(而不是设置)

example jsfiddle

jQuery(document).ready(function () {
    jQuery('#gap-filtedit input[type=button]').click(function () {
        var val = ""; // give variable proper scope vs creating a global

        jQuery('.filter-checkbox:checked').each(function () {
            getchecked = jQuery(this).data('rel');

            val += '[gap '; // append instead of set
            console.log(getchecked);

            jQuery('.' + getchecked).each(function () {
                val += getchecked + '=';
                var name = jQuery(this).find('label').data('id');
                var title = jQuery(this).find('input[type=text],select').val();

                if (!title) title = '';
                if (name != undefined) {
                    val += name + ':' + title + ', ';
                }
            });
        });

        window.send_to_editor(val);
    });
});

图片的标题说明:

  • 范围其他变量(var titlevar name
  • var name = jQuery(this).find('label').data('id');将具有值或undefined(而不是"null"