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

Jquery Tagit Displaying Unwanted x from DB

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

第二个 x 是唯一应该存在的删除记录的 x。我试图删除 × 但后来什么也没有出现。甚至输入值 returns 文本后的 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');

尝试将您的 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>

内的所有节点文本