在2个div之间传输（添加/删除）php数组值

我有一个普通的div，有一个可以手动编辑的输入文本框。 我想从另一个具有一组php数组值的div（从查询中）添加/删除php值。每个值都有一个[Add]或[Remove]按钮，这取决于输入文本字段中是否存在相应的php值

因此，基本上，如果文本框是空的，那么所有的按钮都将是[Add]，单击它将向文本框添加相应的php值，然后变为[Remove]按钮。同样，任何[Remove]按钮都将从文本框中删除相应的php值，然后更改为[Add]按钮

示例：
$values=array（“Mike”、“James”、“Jerry”、“Tom”
输入类型=“文本”

如果我手动更改文本框或在其中输入一些已知的php值（用分号分隔）：

詹姆斯；迈克；海德；杰里

另一个div将动态搜索php数组的所有值，并为存在的值添加一个[Remove]按钮，为文本框中未找到的值添加一个[add]按钮

詹姆斯[删除]
迈克[移除]
汤姆[添加]
Jerry[删除]

请注意#1：此处，“Tom”是在中不存在的唯一值 文本框，因此它有一个[删除]按钮。
注意#2：还有，“Hyde” 不是php数组的值，因此它既没有[Add] 也没有[移除]按钮

---

编辑： 我已经做过的，基本上是回显php查询中的所有数组值，并使用[Add]按钮附加每个值（因为文本框默认为空）
我使用的自定义js函数类似于：

$（“#textbox”）.val（函数（i，val）{return val.replace（phparrayvalue'，）；}

但是，为了动态地更改[Add]和[Remove]之间的按钮，我必须始终保留php数组（AJAX请求获取php值ontextchange的速度很慢）。

我认为如果我能够传递php数组并将其转换为javascript数组，问题就会消失。在这之后，将很容易将保存的js数组与文本框值ontextchange进行比较，并根据结果更改按钮

我希望这是清楚的，有人可以帮助编写javascript代码。

---

谢谢你

你正在尝试做的事情，你考虑过“选择”吗？ 以下是它的链接：

它会让你精确地做你想做的事情，尽管是以一种更加优雅的方式。

---

您可以将您的PHP数组中的名称列表传递到插件中，它可以处理其余的内容。

如果我正确理解了您的问题，这可能会有所帮助

预览：

创建用于测试的简单html文档

test.html 在PHP中创建逗号分隔的列表，并在此处回显它

在这一行后面，我调用了函数jsStart（），它是在外部JavaScript文件adddel.js中定义的

让我们看看这个文件是什么样子

adddel.js 与

"   mike ; john;Sam;Brian "

现在编辑此代码并使其符合您的需要。虽然很简单

---

希望这有帮助，现在这是一个“给我密码”的要求。展示你迄今为止所做的尝试，展示你自己在尝试这方面至少付出了一些努力。有了这一点，我们将尽力提供帮助。但是现在，投票结束。非常感谢，卡兰坎。我会检查一下，然后再给你回复。这太棒了！正是我需要的。非常感谢你的努力。

myArray = 'Mike,James,Jerry,Tom';

var name = Array();

// page preparation
function jsStart(a, div1id, div2id) {
  // create array of names
  name = a.split(',');
  // create div1 html
  html = '<input type="text" name="myedit" id="myedit" class="myinput" value="" onchange="changeText()" onkeyup="changeText()">';
  document.getElementById(div1id).innerHTML = html;
  // create div2 html
  html = '';
  for (i=0; i<name.length; i++) {
    if (name[i].trim() != '') {
      if (html != '') html += '<br />';
      // name
      html += '&bull; <b>' + name[i] + '</b> ';
      // button
      html += ' <span class="btn" id="btn' + i + '" onclick="btnClick(' + i + ')">[Add]</span>';
      }
    }
  if (html == '') html = '&nbsp;';
  document.getElementById(div2id).innerHTML = html;
  changeText();
  }

// fires on input-text change
function changeText() {
  edl = document.getElementById('myedit').value.trim().split(';'); 
  for (i=0; i<name.length; i++) {
    btnText = '[Add]';
    for (j=0; j<edl.length; j++) {
      ne = name[i].trim().toLowerCase();
      nl = edl[j].trim().toLowerCase();
      if (ne == nl) {
        btnText = '[Remove]';
        break;
        }
      }
    document.getElementById('btn' + i).innerHTML = btnText;
    }
  }

// add/remove name from text-input
function btnClick(id) {
  ne = name[id].trim().toLowerCase();
  edl = document.getElementById('myedit').value.trim().split(';'); 
  newed = '';
  found = false;
  for (i=0; i<edl.length; i++) {
    nl = edl[i].trim().toLowerCase();
    if (nl != '') {
      if (nl != ne) newed += edl[i].trim() + ';';
      else found = true;
      }
    }
  if (!found) newed+=name[id]+';'
  document.getElementById('myedit').value = newed;
  changeText();
  }

"Mike;John;Sam; BRian"

"   mike ; john;Sam;Brian "