从代码调用时脚本不起作用，但在控制台中输入时脚本不起作用

我正在使用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

从代码调用时脚本不起作用，但在控制台中输入时脚本不起作用

回答

相关问题