Question

我在<select> html标签中显示一个列表，我想用弹出框显示每个项目的一些细节。我加载了所有js文件，并为每个<option>初始化，但它不会显示任何信息。

 <select id="type_traitement" class="span10"> 
                <?php
                foreach ($type_traitement_simple as $tts) {
                    echo '<option value="' . $tts->id_type_traitement_simple . '">
                        <a href="#" 
                        rel="popover" data-content="' . $tts->description . '"
                        data-original-title="' . $tts->name . '"id="t_'.$tts->id_type_traitement_simple.'">                         
                        ' . $tts->name . '
                            </a>
                            </option>';

                    ?>
                    <script>  
                        $(function ()  
                        { $("#t_<?php echo $tts->id_type_traitement_simple ?>").popover();  
                        });  
                    </script>
                    <?php


                }
                ?>
            </select>

Answer 1

更新您的foreach循环，如下所示。

<?php foreach($type_traitement_simple as $tts): ?>
<option value="<?php echo $tts->id_type_traitement_simple; ?>"
    data-content="<?php echo $tts->description; ?>"
    data-title="<?php echo $tts->name; ?>"><?php echo $tts->name; ?></option>
<?php endforeach; ?>

那应该是循环排序。现在在jQuery，Bootstrap Tooltip和Bootstrap Popover脚本之后添加以下JavaScript。

<script type="text/javascript">
$(function() {
    $('#type_traitement option').popover({
        placement: 'right',
        trigger: 'manual'
    }).hover(function() {
        $(this).popover('toggle');
    });
});
</script>

不能在<select>标签</select>中使用twitter-bootstrap popover

1 个答案: