從代碼調用時腳本不起作用，但在控制檯中輸入時腳本不起作用

我正在使用flexslider小部件來顯示照片庫。它使用簡單的標記，因爲當文檔加載時，它適應視口的標記以及在文檔準備就緒時使用腳本進行樣式化。加載頁面時一切正常。但我需要添加一個「選擇器」，我的意思是，當有人點擊一個鏈接時，應該在flexslider小部件中加載一個新的畫廊。所以，使用jquery，我選擇了相應的gallery div並用$。（「＃galleryID」）寫入新內容。從代碼調用時腳本不起作用，但在控制檯中輸入時腳本不起作用

因此，DOM結構會發生變化，但flexslider不會顯示，因爲它需要通過運行適應視口和樣式的js代碼來「完成」。然後，我嘗試在修改div之後「重新運行」所需的腳本，但div保持空白。如果我從控制檯窗口運行相同的腳本，div顯示正確。

現在我使用$ .getScript（）jquery方法強制重新加載適配和樣式腳本，但有時會工作，有時不會。在Firefox中工作正常：每次你點擊選擇器，加載畫廊OK並運行腳本，但Chrome並沒有，有時它會，有時候div仍然是白色的（使用正確的標記，但不需要進行修改）。

<script type='text/javascript'> 
    $('a.pgal').click(function() { 
    var id = $(this).attr('hashtag'); 
    /*get the gallery elements (imgs, titles, etc)*/ 
    $.get("listgal.php", {hashtag:id}, function(objetogal){ 
    var x=0; 
    /*create the flexslider markup*/ 
    var codigo='<div id="slider" class="flexslider"><ul class="slides">'; 
    var codigocarousel='<div id="carousel" class="flexslider"><ul class="slides">'; 
    var elementos=objetogal.length; 
    for(x=0;x<elementos;x++) 
    { 
     codigo=codigo+ '<li><img src="fotos/'+ objetogal[x].img +'" /><p class="flex-caption">'+objetogal[x].pie+'</p></li>' 
     codigocarousel=codigocarousel+'<li><img src="fotos/'+ objetogal[x].img +'" />'; 
    } 
    codigo=codigo+'</ul></div>'; 
    codigocarousel=codigo+codigocarousel+'</ul></div>'; 

    /*Change the gallery div with this new markup*/ 
    $("#galeriaID").empty().append(codigocarousel); 
    }, "json"); 
    $.getScript("js/renueva.js", function(){ 
    }); 
    return false; 
    }); 
    </script>

renueva.js 這是需要的風格和適應視使用標記作爲源庫中的代碼。它的代碼我試圖在div刷新後包含在同一個腳本中，但它沒有做任何事情。但在控制檯中運行很好。我正在嘗試使用$ .getScript，但有時使用Chrome處理標記，有時不使用Chrome。使用Firefox的作品完美

$('#carousel').flexslider({ 
animation: "slide", 
controlNav: false, 
animationLoop: false, 
slideshow: false, 
itemWidth: 90, 
itemMargin: 5, 
asNavFor: '#slider' 
}); 
$('#slider').flexslider({ 
animation: "slide", 
controlNav: false, 
animationLoop: false, 
slideshow: false, 
sync: "#carousel", 
start: function(slider){ 
} 
});

的HTML標記

 <div class="col-xs-12 w12 col-md-9" id="galeriabr"> 
      <div id="slider" class="flexslider"> 
      <ul class="slides"> 
       <li> 
       <img src="fotos/armas.jpg" /> 
       <p class="flex-caption">Se presentan 98 delitos al día en Michoacán</p> 
       </li> 
       <li> 
       <img src="fotos/sep.jpg" /> 
       <p class="flex-caption">Se tomarán medidas para garantizar evaluación a maestros: SEP</p> 
       </li> 
       <li> 
       <img src="fotos/eleccion.jpg" /> 
       <p class="flex-caption">Scioli gana elección de Argentina pero puede haber segunda vuelta</p> 
       </li> 
      </ul> 
      </div> 
      <div id="carousel" class="flexslider"> 
      <ul class="slides"> 
       <li> 
       <img src="fotos/armas.jpg" /> 
       </li> 
       <li> 
       <img src="fotos/sep.jpg" /> 
       </li> 
       <li> 
       <img src="fotos/eleccion.jpg" /> 
       </li> 
      </ul> 
      </div>    
     </div>

來源

2015-12-15 César Mendoza

有在其中形成的標記環出錯，</li>標籤中abscent。它現在效果更好，但有時會再次顯示空白div。我改變了$ .getScript（）行：

$.when(
    $.getScript("js/renueva.js"), 
    $.Deferred(function(deferred){ 
    $(deferred.resolve); 
    }) 
    ).done(function(){ 
     recarga(); 
    });

「recarga（）」這裏面的函數「renueva.js」我會繼續尋求其他答案，這是因爲它是不是很完美。每次點擊它時，我需要顯示圖庫，而不是每10次點擊中的9次。

來源

2015-12-15 03:43:18

從代碼調用時腳本不起作用，但在控制檯中輸入時腳本不起作用

回答

相關問題