Jquery Tagit 显示数据库中不需要的 x

Question

我在使用 Jquery TagIt 时遇到问题。它工作正常，但是当我从数据库中提取记录并使用 foreach 循环显示它们时，它会像应有的那样显示标签，但然后在末尾添加一个 x 作为文本。

第二个 x 是唯一应该存在的用于删除记录的 x。我尝试删除×，但什么也没有显示。即使输入值也会在文本后面返回一个 x。我不确定我做错了什么。

我提供了一张图片来向您展示我的意思。如果有什么需要澄清的，请告诉我。感谢您的任何帮助。

<?php $my_dietary_requirements = explode(', ', $my_dietary_requirements); ?>
<fieldset class="edit-boxes">
    <ul class="table-tags" id="my-diet">
        <?php foreach($my_dietary_requirements as $diet){
        echo '<li class="tagit-choice ui-widget-content ui-state-default ui-corner-all tagit-choice-editable">
                <span class="tagit-label">'.$diet.'</span>
                <a class="tagit-close">
                  <span class="text-icon">×</span>
                  <span class="ui-icon ui-icon-close"></span>
                </a>
                <input value="'.$diet.'" name="my_dietary_requirements[]" class="tagit-hidden-field" type="hidden">
             </li>';
        } ?>
    </ul>
</fieldset>


//Javascript
 //Dietary Requirements
$("#my-diet").tagit({
    allowSpaces: true,
    fieldName: 'my_dietary_requirements[]'
});
$('#my-diet .tagit-new input').attr('id','my-dietary-requirements');

Answer 1

尝试将您的 foreach 更改为:

<?php foreach($my_dietary_requirements as $diet){
echo '<li>'.$diet.'
        <input value="'.$diet.'" name="my_dietary_requirements[]" class="tagit-hidden-field" type="hidden">
     </li>';
} ?>

我认为你正在尝试添加一堆你的插件自己添加的东西，这最终会让东西以一种奇怪的方式添加两次。它可能连接了原始<li>内节点的所有文本。