更新div的內容時出現的問題

作爲Javascript的新手，我不覺得語言容易。下面的代碼在兩個div之間淡出。在淡入淡出期間，我想更改每個div的內容。雖然我可以成功更新CSS參數，但我一直無法更新內容。也許有人可以幫助：更新div的內容時出現的問題

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

 
<head> 
 
    <style type='text/css' media='screen, print'> 
 
    #cycler { 
 
     position: relative; 
 
    } 
 
    #cycler div { 
 
     position: absolute; 
 
     z-index: 1; 
 
     background-color: white 
 
    } 
 
    #cycler div p { 
 
     font-size: 60px; 
 
     color: black; 
 
     margin: 0; 
 
    } 
 
    #cycler div.active { 
 
     z-index: 3 
 
    } 
 
    #cycler img { 
 
     display: block 
 
    } 
 
    </style> 
 
    <script type='text/javascript'> 
 
    $(window).load(function() { 
 
     setInterval('divCycler()', 3000); 
 
    }); 
 

 
    function divCycler(e) { 
 
     var $active = $('#cycler .active'); 
 
     var $next = ($active.next().length > 0) ? $active.next() : $('#cycler div:first'); 
 
     $next.css('z-index', 2); 
 
     $active.fadeOut(1500, function() { 
 
     $active.css('z-index', 1).show().removeClass('active'); 
 
     $active.innerHTML = "New HTML Text"; // This Line is not working !!!!!!!!!!! 
 
     $active.css('background-color', 'red'); 
 
     $next.css('z-index', 3).addClass('active'); 
 
     }); 
 
    } 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <div class='container'> 
 
    <div id='cycler'> 
 
     <div id='div1' class='active'> 
 
     <p>Test Message 1</p> 
 
     </div> 
 
     <div id='div2'> 
 
     <p>Test Message 2</p> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

我已經表明，包括所有的JavaScript的完整的HTML頁面;這裏沒有其他的代碼。任何關於這個問題的幫助將不勝感激。

來源

2016-02-28 Dietmar Frey

注意：避免使用'eval'字符串。更改'setInterval（'divCycler（）'，3000）;''setInterval（divCycler，3000）;' – 2016-02-28 15:41:07

請考慮在現有答案中添加一些反饋，如果幫助您檢查綠色標記以接受它 – 2016-03-03 14:26:57

$active.innerHTML = "New HTML Text"; // This Line is not working !!!!!!!!!!!

是因爲$active是一個jQuery對象，而不是一個DOM元素，爲您解決問題用途：

$active[0].innerHTML = "New HTML Text";

，或者使用jQuery本身：

$active.html("New HTML Text");

來源

2016-02-28 15:42:42

使用.html()代替innerHTML

 $active.html("New HTML Text"); // This Line is not working

jQuery Documentation: html()

來源

2016-02-28 15:42:45

更新div的內容時出現的問題

回答

相關問題