Question

（我还在学习js / jquery）所以请耐心等待 - 我在页面中有以下代码 - 如果我回显$ data，它完美地工作 - 单词加载正确。但当我回显模态（包含相同的$ data）时，功能停止，我只是在框中输入文字。

该页面具有相同的包含（它是我用于独立代码的测试页面）。我是否需要将令牌js和css文件重新加载到模态中（尝试但不能正常工作） - 我缺少什么？

令牌输入没有额外的js，它只是加载js和css文件。

$data='<span class="font-heavy" id="">To:</span> 
             <input type="text" id="users" name="blah" placeholder="Add friends"/>
            <input type="hidden"  id="tags"/>


  <script type="text/javascript">
    $(document).ready(function() {

        $("#users").tokenInput([
            {id: 7, name: "Ruby"},
            {id: 11, name: "Python"},
            {id: 47, name: "Java"}

        ],{
            prePopulate: [

                /*{id: 123, name: "Pri User"},
                {id: 555, name: "Bob Hoskins"}*/
            ],theme: "facebook",preventDuplicates: true, hintText: "Add friends"
        });
    });
    </script>
    ';



$modal = '<a href="#" id="NewRatingsLink">Load Modal</a>

<script type="text/javascript">
    $(document).ready(function(){
        $("#NewRatingsLink").click(function(){
            $("#newRatingsModal").modal("show");
      });
  });
</script> 

<style>.modal {
      overflow-y: hidden;
  }</style>


<div id="newRatingsModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
        <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Overall Rating: '.@RatingStars($ave).'</h4>
            </div>
            <div class="modal-body">

        <div id="listratings">
        '.$data.'
      </div>

            </div>
            <div class="modal-footer">

                <button type="button" class="btn btn-green" data-dismiss="modal">Cancel</button>'.@$submit.'
                <div class="message"></div>
            </div>
        </div>
    </div>
</div><!-- END of Modal HTML -->';

谢谢！

Answer 1

这可能是一个z指数问题。使用TokenInput设置中的参数将TokenInput的z-index设置为高于模式弹出窗口。

   $("#users").tokenInput([
        {id: 7, name: "Ruby"},
        {id: 11, name: "Python"},
        {id: 47, name: "Java"}

    ],{
        prePopulate: [

            /*{id: 123, name: "Pri User"},
            {id: 555, name: "Bob Hoskins"}*/
        ],theme: "facebook",
preventDuplicates: true, 
hintText: "Add friends",
z-index: 9999
    });

Answer 2

我在所有css文件中更改了所有z-index值，现在它已经修复了，根据以前的问题，单行不能解决我的问题。另外 - 至于重复的问题，我甚至不知道他们正在后台加载，我的文本框甚至没有出现，所以我不知道这是一个可能的z索引的事情。

无论如何 - 感谢所有输入，它现在有效！

在bootstrap模式中加载时，TokenInput停止工作

2 个答案: