成功時在跨度中顯示數組單詞AJAX

我有此代碼將顯示帶有複選框的單詞。正如你所看到的，它們是用逗號分隔的，我使用split（）函數來爆炸字符串，使它成爲一個數組。我用for循環來重複單詞，但是我得到了一個「未定義」的單詞。它應該用複選框自動顯示單詞，但單詞顯示爲未定義。當我點擊刷新時，它顯示正確的單詞，並有一個複選框。我不確定問題在哪裏。對此有何想法？成功時在跨度中顯示數組單詞AJAX

$(document).on('click', '#wordlistsave', function() 
    { 

    var user = $("#getUser").val(); 
    var title = $("#wordbanktitle").val(); 
    var word = $("#wordbanklist").val(); 
    var postID = $("#getPostID").val(); 
    var words = word.split(", "); 


    for(var i = 0; i < words.length; i++) 
    {     
    var dataString = 'user='+user+'&title='+title+'&words='+words[i]+'&id='+postID; 

    <?php if (is_user_logged_in()): ?> 
     if(words[i]) 
     { 

     $.ajax({ 
     type: "POST", 
     url: "<?= plugins_url('wordlistsave.php', __FILE__) ?>", 
     data: dataString, 
     cache: true, 
     success: function(postID) 
     { 

     var testBoxDiv = $(document.createElement('div')).attr("id", words[i]); 
     testBoxDiv.css({"margin-bottom":"5px"}); 
     testBoxDiv.after().html('<span id="'+words[i]+'" style="cursor:pointer">\ 
     <img src="./wp-content/plugins/wordwork/admin/pdfpreview/delete_icon.png" title="Delete word"></span>\ 
     &nbsp&nbsp<input type="checkbox" name="words[]" value="'+ words[i]+ '">'+words[i]); 
     testBoxDiv.appendTo("#test_container"); 

     } 
     }); 
     } 


    <?php else: ?> 
     alert('Please login.'); 
    <?php endif; ?> 
    }  

    });

來源

2014-09-01 user3627265

words是成功的功能可見，但在執行時不能爲i價值肯定，因爲它不syncronously執行。
因此，您可以將一個額外的參數，單詞傳遞給ajax安裝字典，並從成功函數訪問它。就像這樣：

$.ajax({ 
    type: "POST", 
    url: "<?=plugins_url('wordlistsave.php', __FILE__)?>", 
    data: dataString, 
    cache: true, 
    word : words[i], 
    success: function(postID) 
    { 

     var testBoxDiv = $(document.createElement('div')).attr("id", this.word); 
     testBoxDiv.css({"margin-bottom":"5px"}); 
     testBoxDiv.after().html('<span id="'+this.word+'" style="cursor:pointer"><img src="./wp-content/plugins/wordwork/admin/pdfpreview/delete_icon.png" title="Delete word"></span>&nbsp&nbsp<input type="checkbox" name="words[]" value="'+ this.word+ '">'+this.word); 
     testBoxDiv.appendTo("#test_container"); 

    } 
});

來源

2014-09-01 05:36:21 xecgr

不錯的，它的工作原理。我只是調整了CSS，因爲它在單詞上方增加了一個空格。 – user3627265 2014-09-01 05:44:07

而且，你不需要構造數據串$阿賈克斯，你可以簡單地傳遞數據，如：

$.ajax({ 
    type: "POST", 
    url: "<?=plugins_url('wordlistsave.php', __FILE__)?>", 
    data: { 
     user: user, 
     title: title, 
     words: words[i], 
     id: postID 
    }

來源

2014-09-01 05:55:44 Ovais

成功時在跨度中顯示數組單詞AJAX

回答

相關問題