-1

「グループ」に基づいてチェックボックス入力を生成するタグピッカーを定義します。必要なタグを選択して[完了]ボタンを押すと、テキスト入力の値を設定するための文字列が返されます。

関連するコードは次のとおりです。問題は、それが最初にうまく機能するだけであるということです。たとえば、初めてタグの「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);           
})
4

1 に答える 1

1

要素がクリックされるたびにプラグインを初期化しています。DOM の準備ができたら、一度初期化する必要があります。

またはとにかくこれをしたい場合; .one()イベントを 1 回だけ実行して、それ自体を削除するために使用できます。.off()で添付されたイベントを切り離すために使用し.on()ます。

于 2013-01-29T22:49:45.263 に答える