Question

我使用的是Javascript magicsuggest plugin。

此插件有一个回调Access-Control-Allow-Headers，允许您在插入之前更改选择的html。

我正在尝试做的是根据用户输入更改选择html。

所以我设置它的方式，selectionRenderer回调打开一个Bootstrap模式，里面有一个表单。然后为提交该表单创建另一个selectionRenderer回调。

我无法弄清楚如何将submit回调中收集的数据传递到submit回调中。

selectionRenderer

JSFiddle

如您所见，此示例中的$(function() { var modal = $('#exampleModal'); $('#magicsuggest').magicSuggest({ selectionRenderer: function(data){ modal.modal('show'); var color = 'red'; modal.find('#color-form').submit(function(e) { e.preventDefault(); color = $(this).find('#color-input').val(); console.log(color); modal.modal('hide'); }); return '<span style="color: '+color+';">' + data.name + '</span>'; }, allowFreeEntries: false, data: data }); });收集在color回调中，但由于该回调是异步触发的，因此无法将该数据传递给{{1}回调，因为该函数已经返回。

在一个完美的世界中，我显然可以让代码停止并等待回调继续，但由于它是一个插件，我宁愿不分叉和屠宰它。

Answer 1

将打开模态的事件更改为选择事件，并在提交处理程序中查找最后一个标记以更改其颜色

 var ms = $('#magicsuggest').magicSuggest({
    selectionRenderer: function(data) { 
      return '<span class="my-tags">' + data.name + '</span>';
    },
    allowFreeEntries: false,
    data: data
  })

  $(ms).on('selectionchange', function(e, m) {
    modal.modal('show');
  });;

  $('#color-form').submit(function(e) {
    e.preventDefault();
    var color = $('#color-input').val();
    $('.my-tags:last').css('color', color);   
    modal.modal('hide');
  });

的 DEMO

JS：使回调返回另一个回调的输出

1 个答案: