Question

大家早上好！

我有一个问题，我不确定我应该使用哪种语言。我假设javascript，因为幻灯片是javascript。

我需要创建一个幻灯片，用户可以在幻灯片之间更改时间。大约有100张幻灯片，他们希望能够在每个幻灯片之间设置时间。

我已将所有图片放在服务器上并创建了一个带有链接的数据库，并且幻灯片显示正常，但我似乎无法找到一种方法使超时具有不同的值。任何帮助是极大的赞赏。

以下是代码：

<?php include_once 'includes/db_connect.php';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Weather Show</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="responsiveslides.css">
<link rel="stylesheet" href="demo.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="responsiveslides.min.js"></script>

<script type="text/javascript">
function display_c(){
     var refresh=1000; // Refresh rate in milli seconds
     mytime=setTimeout('display_ct()',refresh)
}

function display_ct() {
     var strcount
     var x = new Date()
     document.getElementById('ct').innerHTML = x;
     tt=display_c();
}
</script>


<?php
echo "<script>
                $(function () {
                    $('#slider1').responsiveSlides({
                        maxwidth: 1080,
                        speed: 1000,
                        timeout: 5000
                        });
                    });
              </script>";

echo "</head>
<body style='background-color: #000;' onload=display_ct();>
<div id='wrapper'>";  

$result = mysqli_query($mysqli,"SELECT * FROM weather WHERE status = '1'");
?>

<!-- Slideshow 1 -->
<ul class="rslides" id="slider1">
<?php  while($row = mysqli_fetch_array($result))
    {
        echo "<li><img src='"; echo $row['link']; echo "' alt='"; echo $row['link']; echo "'></li>";
    }
    ?>
</ul>
</div><!-- end wrapper -->

<div style=" margin-top:-30px; ">
<span id='ct' style="font-weight:bold; font-size:36px; color:#FFF; margin-left:30px;"></span>
</div>


</body>
</html>

我当时要使用PHP变量，这就是为什么我只是回应javascript。这对我来说效果不太好。所以，如果有人知道如何做到这一点，并想让我知道，这将是惊人的！谢谢！

Answer 1

如果您将refresh和mytime变量更加全局化，则可以在javascript端执行所有操作。跟踪您的mytime - 变量（来自display_c()）。添加您的编辑框以及跟踪指定新间隔所需的任何事件。

一旦触发该事件，您拨打clearTimeout(mytime);以停止时间，使用新值更新refresh变量并再次致电display_c()以重新开始此过程：

<?php
   $refresh = 1000; // Current value from database
   echo <<<JAVAVSCRIPT 
   <script>

   $(function () {
         $('#slider1').responsiveSlides({
            maxwidth: 1080,
            speed: $refresh,
            timeout: 5000
         });
    });

    $('#speed-input-id').change(function(e) {
        refresh = parseInt($(this).val());
        $.ajax('/updateTheDatbaseTimeoutValueUrl', {data: {refresh: refresh}});
        // I can't help you on reconfiguring the plugin, too little information
        updateTheResponsiveSlidesTimeout(refresh); 
        e.preventDefault();
    });
 });

如何动态更改javascript中的超时

1 个答案: