爲什麼是：第一個孩子不工作？

爲什麼jQuery的這部分工作不正常？爲什麼是：第一個孩子不工作？

$(function() { 

    if ($('#slide-01').is(":first-child")) { 
    $('input:radio[id=target-slide-01]').prop('checked', true); 
    } else { 
    $('input:radio[id=target-slide-01]').prop('checked', false); 
    } 

    if ($('#slide-02').is(":first-child")) { 
    $('input:radio[id=target-slide-02]').prop('checked', true); 
    } else { 
    $('input:radio[id=target-slide-02]').prop('checked', false); 
    } 

    if ($('#slide-03').is(":first-child")) { 
    $('input:radio[id=target-slide-03]').prop('checked', true); 
    } else { 
    $('input:radio[id=target-slide-03]').prop('checked', false); 
    } 

    if ($('#slide-04').is(":first-child")) { 
    $('input:radio[id=target-slide-04]').prop('checked', true); 
    } else { 
    $('input:radio[id=target-slide-04]').prop('checked', false); 
    } 

});

的鏈接被實現，其中的jQuery位於此jsFiddle。

當我檢查HTML和CSS中的元素時，每張幻燈片最終都有'：first-child'（幻燈片旋轉），但是我的猜測是jQuery沒有識別旋轉或者我的jQuery沒有關閉。

我也試過使用：第一位代替：第一個孩子，但它沒有區別。

來源

2014-10-27 Andrew

我不知道jQuery的，但如果你是將開始與具有四張幻燈片的標記，然後幻燈片三從邏輯上不會成爲第一個孩子，不是？ – TylerH 2014-10-27 13:33:14

一旦DOM準備好了，你就可以調用這個函數，但是再也不要......然後第一個孩子總是slide-01。每次更換幻燈片時都需要調用該函數。 – DaniP 2014-10-27 13:35:04

@Danko：您應該將其添加爲答案:) – LinkinTED 2014-10-27 13:39:17

您的單選按鈕的功能只能在頁面加載時調用一次，因爲它是一個匿名自調用函數。如果你給一個名字

function updateRadioButtons() { 

    if ($('#slide-01').is(":first-child")) { 
     $('input:radio[id=target-slide-01]').prop('checked', true); 
    } else { 
     $('input:radio[id=target-slide-01]').prop('checked', false); 
    } 

    if ($('#slide-02').is(":first-child")) { 
     $('input:radio[id=target-slide-02]').prop('checked', true); 
    } else { 
     $('input:radio[id=target-slide-02]').prop('checked', false); 
    } 

    if ($('#slide-03').is(":first-child")) { 
     $('input:radio[id=target-slide-03]').prop('checked', true); 
    } else { 
     $('input:radio[id=target-slide-03]').prop('checked', false); 
    } 

    if ($('#slide-04').is(":first-child")) { 
     $('input:radio[id=target-slide-04]').prop('checked', true); 
    } else { 
     $('input:radio[id=target-slide-04]').prop('checked', false); 
    } 

    }

你可以調用它，當你的幻燈片得到了改變

function moveLeft() { 
    $('#myslider ul').animate({ 
     left: +containerWidth 
    }, 600, function() { 
     $('#myslider ul > li:last-child').insertBefore('#myslider ul > li:first-child'); 
     $(this).css('left', ''); 
     updateRadioButtons(); 
    }); 

} 

function moveRight() { 
    $('#myslider ul').animate({ 
     left: -containerWidth 
    }, 600, function() { 
     $('#myslider ul > li:first-child').insertAfter('#myslider ul > li:last-child'); 
     $(this).css('left', ''); 
     updateRadioButtons(); 
    }); 

}

，並在頁面加載

$(function() { 

    // Key animation. 

    updateRadioButtons(); 

    var myTimer = setInterval(function() { 
    moveRight(); 
    }, 5000);

來源

2014-10-27 13:56:02 Markai

謝謝！完美解決問題。 – Andrew 2014-10-27 14:01:08

爲什麼是：第一個孩子不工作？

回答

相關問題