Question

我定义了一个标签选择器，它将根据“组”生成复选框输入。如果我选择了我想要的标签并按下完成按钮，它应该返回一个字符串来设置文本输入的值。

以下是相关代码。问题是它只在第一次运作良好。例如，如果我第一次检查标签中的'jquery'，'javascript'，

console.log('output is:' + tags);

打印'输出是：jquery，javascript'。作品！然后我再次使用它并选择'jquery'，'javascript'，'bootstrap'，它将返回

output is: jquery,javascript,bootstrap
output is:

再次'jquery'，'javascript'，'bootstrap'，它返回

output is: jquery,javascript,bootstrap
output is:
output is:

似乎按下完成按钮，重复调用该功能。被困了几个小时却无法弄明白。非常感谢您的回答！感谢

(function(){
  $.fn.tagPicker = function(source,options){
    var settings = $.extend({
      perRow : 3
    },options);

    $.fn.attachRow = function(row,col){
      //codes here
      ...
    }

    $.fn.attachPicker = function(){
      //codes here
      // generate html for checkbox inputs
      ...
    };

    var $input = this;

    if($('.tag-picker').length == 0){ 
      $input.attachPicker(); 

      $('body').on('click','.tag-picker .close-picker',function(){
        $('.tag-picker').remove();
      })

      $('.tag-picker .close-picker').off();

      $('body').on('click','.tag-picker #btn-done', function(){
        var tags = getTags();
        $('.tag-picker').remove();
        console.log('output is:' + tags);
        $input.val(tags);       
      });
    }

    function getTags(){
      var t = [];
      $('.tag-picker input').each(function(){
        if($(this).is(':checked')) t.push($(this).attr('id'));
      })
      return t.join(',');
    }
  }
})(jQuery);

$('body').on('click','input.participant',function(){
      $(this).val('');
      $(this).tagPicker(group);           
})

Answer 1

每次单击元素时，您都在初始化插件。在DOM就绪时，您应该初始化一次。

或者如果你想这样做的话;您可以使用 .one() 使该事件仅运行一次并自行删除。使用 .off() 分离与.on()相关联的活动。

在javascript中重复调用的函数

1 个答案: