Bootstrap模式弹出不工作在IE和Mozilla

Question

所有似乎完美，并在铬中工作，但是一旦我在safari，mozilla和IE中打开什么都没有发生。

这里是下面的代码：

<!-- MAIN CONTENT - CATEGORIES --> 
 
<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-xs-12"> 
 
     <div class="home_cats"> 
 
     <div class="clearfix"> 
 
      <div class="row"> 
 
      <?$i=0; foreach($categs as $c):?> 
 
       <?if($c['id_category_parent'] == 1 AND $c['id_category'] != 1 AND ! in_array($c['id_category'], $hide_categories)):?> 
 
       <div class="col-xs-12 col-sm-4 col-md-4"> 
 
        <div class="panel panel-home-categories"> 
 
        <div class="panel-heading"> 
 
         <a title="<?=HTML::chars($c['name'])?>" href="<?=Route::url('list', array('category'=>$c['seoname'], 'location'=>$user_location ? $user_location->seoname : NULL))?>"> 
 
         <?$icon_src = new Model_Category($c['id_category']); $icon_src = $icon_src->get_icon(); if(($icon_src)!==FALSE):?> 
 
          <img src="<?=Core::imagefly($icon_src,30,20)?>" alt="<?=HTML::chars($c['name'])?>"> 
 
          <?endif?> 
 
          <?=mb_strtoupper($c['name']);?> 
 
           <?if (Theme::get('category_badge')!=1) : ?> 
 
           (
 
           <?=number_format($c['count'])?>) 
 
            <?endif?> 
 
         </a> 
 
        </div> 
 
        <div class="panel-body"> 
 
         <ul class="list-group"> 
 
         <?$ci=0; foreach($categs as $chi):?> 
 
          <?if($chi['id_category_parent'] == $c['id_category'] AND ! in_array($chi['id_category'], $hide_categories)):?> 
 
          <?if ($ci < 3):?> 
 
           <li class="list-group-item"> 
 
           <a title="<?=HTML::chars($chi['name'])?>" href="<?=Route::url('list', array('category'=>$chi['seoname'], 'location'=>$user_location ? $user_location->seoname : NULL))?>"> 
 
            <?if (Theme::get('category_badge')!=1) : ?> 
 
            <span class="pull-right badge badge-success"><?=number_format($chi['count'])?></span> 
 
            <?endif?> 
 
             <?=$chi['name'];?> 
 
           </a> 
 
           </li> 
 
           <?endif?> 
 
           <?$ci++; if($ci == 3):?> 
 
            <li class="list-group-item"> 
 
            <a role="button" class="show-all-categories" data-cat-id="<?=$c['id_category']?>"> 
 
             <?=__("See all categories")?> <span class="glyphicon glyphicon-chevron-right pull-right"></span> 
 
            </a> 
 
            </li> 
 
            <?endif?> 
 
            <?endif?> 
 
             <?endforeach?> 
 
         </ul> 
 
        </div> 
 
        </div> 
 
       </div> 
 
       <? $i++; if ($i%3 == 0) echo '<div class="clear"></div>';?> 
 
        <?endif?> 
 
        <?endforeach?> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
<div id="modalAllCategories" class="modal fade" tabindex="-1" data-apiurl="<?=Route::url('api', array('version'=>'v1', 'format'=>'json', 'controller'=>'categories'))?>"> 
 
    <div class="modal-dialog modal-sm"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
     </div> 
 
     <div class="modal-body"> 
 
     <ul class="list-group"> 
 
     </ul> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
<!-- // MAIN CONTENT - CATEGORIES -->

我想插入列表视图弹出窗口，当我点击该按钮。示例中的内容相同。 这里是例子：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script> 
 
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css" "> 
 

 

 
<div class="body-content"> 
 
<div align="center"> 
 

 
<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button> 
 

 
</div> 
 

 
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> 
 
    <div class="modal-dialog modal-sm" role="document"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header sub-modal"> 
 
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
     </div> 
 
    
 
      <div class="modal-body"> 
 
       <ul class="list-group"> 
 
       <li class="list-group-item"><a href="#"> Here where i want the list view 1</a></li> 
 
       <li class="list-group-item"><a href="#"> Here where i want the list view 2</a></li> 
 
       <li class="list-group-item"><a href="#"> Here where i want the list view 3</a></li> 
 
       <li class="list-group-item"><a href="#"> Here where i want the list view 4</a></li> 
 
       </ul> 
 
      </div> 
 
     
 
    </div> 
 
    </div> 
 
</div> 
 
</div> 
 

 
<style> 
 
.body-content{padding-top:100px;} 
 
.sub-modal{background:#4285f4;} 
 
li {list-style-type: none;} 
 
.list-group-item { 
 
    position: relative; 
 
    display: block; 
 
    padding: 10px 15px; 
 
    margin-bottom: -1px; 
 
    background-color: #fff; 
 
    border: 1px solid #ddd; 
 
} 
 
li:hover{background:#4285f4;} 
 
a:focus, a:hover { 
 
    color: #fff; 
 
    text-decoration: none; 
 
} 
 

 
</style>

Answer 1

几乎24小时这一问题的工作后！我终于找到了解决方案，我忘记了在我的网站上使用（https）即时通讯，现在我通过将其置于htaccess中解决了这个问题。

Answer 2

在您的链接标记删除多余的引号（“），我希望它的工作原理