腳本發射兩次

我一直在努力尋找解決方案。腳本發射兩次

我有一個適用於所有設備的頁面，它在桌面上加載jQuery，在移動設備上切換到jQuery mobile。

我在從csv文件加載信息並創建一個li列表的頁面上有一個腳本，不是它工作正常，但由於某種原因，它在移動設備上加載li列表兩次。我試過

$("#wrapper").live('pageinit', function() { 
    // more stuff 
});

它在移動但在桌面視圖它沒有加載李的。我也嘗試過document.ready，但是li仍然在移動設備上加載了兩次。

下面的代碼： -

<div> 
    <form method="post" class="right"> 
     <div class="accnt_cont" > 
     <div id="top5productlist" data-role="page" data-dom-cache="false"> 
     <div class="banner"> 
     <h2>View All Top 5</h2> 
     </div> 
     <ul id="tfive" class="listing"> 
     &nbsp; 
     </ul> 
     </div> 
     <!-- /#producttabs --> <!-- include return_policy.cont.inc.html ENDS --></div> 
     <!-- /.accnt_cont --> 
    </form> 
    </div> 
    <script> 
    (function() { 

    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = handleStateChange; 
    xhr.open("GET", "example-data.csv"); 
    xhr.send(); 
    //display("Request sent"); 

    function handleStateChange() { 
     if (xhr.readyState == 4 && 
      xhr.status >= 200 && 
      xhr.status < 300) { 
     //display("Got response"); 
     showData(xhr.responseText); 
     } 
    } 

    function showData(data) { 
     var rows = data.split(/\n/); 
     var rowNum; 
     var cells; 
     var cellNum; 

     for (rowNum = 1; rowNum < rows.length; ++rowNum) { 
     cells = rows[rowNum].split(","); 
      display('<li>' + cells[1] + '</li>'); 
     } 
    } 

    function display(msg) { 
     var p = document.createElement('li'); 
     p.innerHTML = String(msg); 
     document.getElementById("tfive").appendChild(p); 
    } 
    })(); 
    </script>

我希望腳本桌面和移動工作，只加載力的一次。有什麼建議麼？感謝

來源

2014-10-20 Neb9

爲什麼你通過''

'+ cells [1] +'

''並將它插入到html中，只需傳遞'cells [1]'？ – 2014-10-20 13:35:18

有很多HTML之間的李我的大部分，因爲它更容易閱讀代碼的方式。 – Neb9 2014-10-20 13:40:54

試着改變你的功能

function showData(data) { 
    var rows = data.split(/\n/); 

    for (var rowNum = 1; rowNum < rows.length; ++rowNum) { 
    var cells = rows[rowNum].split(","); 
     display(cells[1]); 
    } 
} 

function display(msg) { 
    var p = document.createElement('li'); 
    p.innerHTML = msg; 
    document.getElementById("tfive").appendChild(p); 
}

來源

2014-10-20 13:39:37

嗨，試過了，我仍然在手機上獲得了li的兩次加載。我認爲這個問題是jquery mobile兩次啓動腳本。 – Neb9 2014-10-20 13:56:22

好，我知道它的工作。嘗試了很多不同的方法來使用JQuery調用函數，所有這些方法導致腳本運行兩次後，我決定嘗試使用純JavaScript，並且它工作正常！我改變了函數調用

window.onload = function(){ 
};

而現在只加載腳本once.I'm不知道這是否是做的最好的方式，但它的工作原理。

來源

2014-10-21 08:59:43 Neb9

腳本發射兩次

回答

相關問題