JavaScript в шаблоне блейда laravel У меня есть слайдер изображений, который работает на моем php-сайте. Однако, когда я помещаю точный код на лезвие, он не работает

#javascript #laravel

Вопрос:

код java-скрипта работает на странице php. Что я должен сделать, чтобы заставить его работать в laravel по шаблону лезвия. как я могу это сделать. Похоже, JavaScript не работает.Я не уверен, в чем проблема.

 <script  src="{{url('js/jquery-1.10.2.min.js')}}"></script>
<script  src="{{url('js/jquery-migrate-1.2.1.js')}}"></script>
<script  src="{{url('js/jHtmlArea-0.7.5.js')}}"></script>
<script  src="{{url('jquery.center.min.js')}}"></script>
<script  src="{{url('js/jquery.printElement.js')}}"></script>
<script src="{{url('js/jquery.backstretch.min.js')}}"></script>
<script src="{{url('js/jquery.highlight-3.js')}}"></script>
<script src="{{url('js/main.js')}}"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>


<script>



$(document).ready(function(){
    $("#slideshowx > div:gt(0)").hide();
    setInterval(function() {
    $('#slideshowx > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshowx');
    $('.grid').masonry('layout');
    },  4000);
});
</script>
<STYLE>
</STYLE>
<?php 
$number=1; 
echo "<DIV ID='slideshowx' STYLE='margin:0px auto;position:relative;width:100%;max-  width:540px;padding:0px;border:0px solid #00ff00;'>";
echo "<IMG SRC='images/blank.png' BORDER=0 STYLE='width:100%;border-radius:5px;border:0px solid #AAAAAA;object-fit:fill;'>";
//echo "<DIV STYLE='position:absolute;top:0px;left:0px;right:0px;bottom:0px;border-radius:5px;width:100%;max-width:540px;'><IMG SRC='images/mobilefriendly2.png?t=".time()."' BORDER=0 STYLE='width:100%;max-width:540px;border-radius:5px;border:0px solid #262938;'></DIV>";
$pixs = array_diff(scandir("pixs"), array('..', '.'));
foreach($pixs as $key => $src){
    echo "<DIV STYLE='position:absolute;top:0px;left:0px;right:0px;bottom:0px;border-radius:5px;width:100%;max-width:540px;border:0px solid #00FF00;overflow:hidden;'>";
    echo "<IMG SRC='pixs/".$src."?t=".time()."' BORDER=0 STYLE='width:100%;border-radius:5/px;border:0px solid #AAAAAA;object-fit:fill;'>";
    if ($number % 2 == 0)
    //echo "<IMG SRC='images/3uiitte.png' BORDER=0 STYLE='width:100%;object-fit:fill;border-radius:5px;position:absolute;left:0px;top:0px;border:0px solid #DDDDDD;'>";
    //else
    //echo "<IMG SRC='images/4uiitte.png' BORDER=0 STYLE='width:100%;object-fit:fill;border-      radius:5px;position:absolute;left:0px;top:0px;border:0px solid #DDDDDD;'>";
    $number  ;      
    echo "</DIV>";
    
}   
print_r($pixs);
echo "</DIV>";
echo "</DIV></DIV>";
 

Ответ №1:

В блоке сценария вы сначала загружаете jQuery :

 <script  src="{{url('js/jquery-1.10.2.min.js')}}"></script>
 

и тогда последняя версия будет другой :

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 

Выберите одну версию и загрузите ее, прежде чем загружать все остальные сценарии, которые зависят от нее. Поскольку вы загружаете его дважды, все сценарии, загруженные до того, как вы загрузите его во второй раз, не будут работать.