正在阻止未定义的数组条目

Preventing an Undefined array entry

本文关键字:数组 未定义      更新时间:2023-09-26

我有两个简单的函数,当被调用时,它们要么在数组中向后移动一个条目,要么向前移动一个条目的位置。然而,当您到达末尾并且所有条目都已显示时,会有一个额外的"未定义"条目。关于如何解决这个问题,有什么建议吗?

<?php
$slide_img_array = array();
$slide_desc_array = array();
$slide_name_array = array();
while (!$sql_pres_select->eof()) {
    array_push($slide_img_array, $sql_pres_select->valueof('file_location'));
    array_push($slide_desc_array, $sql_pres_select->valueof('description'));
    array_push($slide_name_array, $sql_pres_select->valueof('slide_name'));
    $sql_pres_select->next();
}
?>
<script>
    var slide_no = 0;
    var slides = <?php echo json_encode($slide_img_array); ?>;
    var desc = <?php echo json_encode($slide_desc_array); ?>;
    var names = <?php echo json_encode($slide_name_array); ?>;
    function nextSlide() {
        if (slide_no < slides.length) {
            slide_no++;
            document.getElementById("display").src = slides[slide_no];
            document.getElementById("func_slide_desc").innerHTML = desc[slide_no];
            document.getElementById("func_slide_name").innerHTML = names[slide_no];
        }
    }
    function prevSlide() {
        if (slide_no > 0) {
            slide_no--;
            document.getElementById("display").src = slides[slide_no];
            document.getElementById("func_slide_desc").innerHTML = desc[slide_no];
            document.getElementById("func_slide_name").innerHTML = names[slide_no];
        }
    }
    function goToSlide(id) {
        slide_no = id;
        document.getElementById("display").src = slides[slide_no];
        document.getElementById("func_slide_desc").innerHTML = desc[slide_no];
        document.getElementById("func_slide_name").innerHTML = names[slide_no];
        document.getElementById('slide_index').innerHTML = slide_no;
    }
</script>

我想我需要写一行,检查是否已经到达数组的末尾。但我不确定该怎么做。我试过做以下事情:

function nextSlide() {
            if (slide_no < slides.length) {
                slide_no++;
                document.getElementById("display").src = slides[slide_no];
                document.getElementById("func_slide_desc").innerHTML = desc[slide_no];
                document.getElementById("func_slide_name").innerHTML = names[slide_no];  
            } 
            else if (slide_no===slides.length){
                break;
            }

但当我尝试时,它只是在第一个条目处停止,nextSlide函数将不再工作

问题是,要访问数组元素,需要索引在0到数组长度-1之间。

在nextSlide()的第一个实现中,您要执行以下操作:

function nextSlide() {
    if (slide_no < slides.length) {
        slide_no++;

这意味着当slide_no等于length-1并且您调用该函数时,if()条件将为true,因为slide_n0将小于slides.length。然后您在slide_no上加1,这意味着现在slide_no等于slides.llength,并且您的1超出了索引限制-这就是为什么您得到了一个未定义的值。我会像这个一样重写它

function nextSlide() {
    if (slide_no < slides.length - 1) {
        slide_no++;
        document.getElementById("display").src = slides[slide_no];
        document.getElementById("func_slide_desc").innerHTML = desc[slide_no];
        document.getElementById("func_slide_name").innerHTML = names[slide_no];
    }
}

删除else if及其内部的所有内容,也将slide_no < slides.length替换为slide_no < slides.length - 1或将行slide_no++移动到if块中命令的末尾。

所以它可以解决你的问题。问题是在访问slides阵列之前增加了slide_no

为了避免执行一些不需要在函数中执行break的东西,只需提交添加任何新代码(仅将代码添加到if主体中),或者如果需要停止函数的进一步执行,则将return;放入else语句中。