動態jQuery對話從循環內傳遞JSON對象

我想知道是否有比我目前的實現更好（清潔？）的方法。我目前正在編碼一個PHP SimpleXMLObject（USPS Tracking API）爲JSON，並通過JavaScript循環瀏覽所述JSON對象以操作前端。從我的下面當前實現動態jQuery對話從循環內傳遞JSON對象

實例：

函數來顯示實現對話匿名以外的.ready()：

var moreInfo_popup = function(i) { 
$('#moreinfo'+i).dialog({ 
     modal:false, 
     autoOpen:false, 
     height:555, 
     title: 'Detailed View', 
     width:500, 
     draggable:false, 
     buttons: { 
      Ok: function(){ 
       $(this).dialog("close"); 
     } 
    } 
    }); 

     $('#moreinfo'+i).dialog('open'); 

     }

用於顯示追蹤ID，最新事件，和郵件類爲每個API響應主迴路 - 我目前正在生成一個附加到#modal_container的內容div，然後通過<input onClick="">在線調用moreInfo_popup()：

for(var key in obj) { 
        if(obj.hasOwnProperty(key)) { 
        if(key % 2 === 0) { 
        $('#page-nav').append("<div id=\"results_table\"><table class=\"data_table\"id=\"data_table_id\"border=\"0\"width=\"60%\"align=\"center\"><tr><td align=center width=20%>"+obj[key].TrackInfo.Attributes.ID+"</td><td align=\"center\"width=\"35%\">"+obj[key].TrackInfo.StatusSummary+"</td><td align=\"center\"width=\"20%\">"+obj[key].TrackInfo.Class+"</td><td align=\"center\"><input type=\"button\"class=\"moreInfo\"value=\"Detail\"id=\"_buttonMoreInfo\"onClick=\"moreInfo_popup("+key+")\"></td></tr></table></div>"); 

        $('#modal_container').append("<div id=\"moreinfo" + key + "\"><table><tr><td>" + obj[key].TrackInfo.Attributes.ID +"</td></tr></table>").hide(); 
        } 
       else { 
        $('#page-nav').append("<div id=\"results_table\"><table class=\"data_table_even\" id=\"data_table_id\" border=0 width=60% align=center><tr><td align=center width=20%>" 
             + obj[key].TrackInfo.Attributes.ID + "</td><td align=center width=35%>" + obj[key].TrackInfo.StatusSummary + "</td><td align=center width=20%>" 
             + obj[key].TrackInfo.Class + "</td><td align=\"center\"><input type=\"button\" value=\"Detail\" class=\"moreInfo\" id=\"_buttonMoreInfo\"onClick=\"moreInfo_popup("+key+")\"></td></tr></table></div>"); 

        $('#modal_container').append("<div id=\"moreinfo" + key + "\"><table><tr><td>" + obj[key].TrackInfo.Attributes.ID +"</td></tr><tr><td> <button>OK</button></td></tr></table>"); 


       } 

      } 

     $("#page-nav td:contains('undefined')").html("Invalid");  
    }

正如我確信你可以看到的，這感覺就像是一種令人難以置信的完成預期結果的方式，對此它肯定有更好的選擇。作爲JavaScript/jQuery的新手，我已經在這個主題上做了大量的搜索，但是還沒有真正理解我發現的東西 - 如果的確如此，我首先會問正確的問題。

來源

2015-09-04 Dustin Gulley

你是說你有一個工作腳本，你只是想知道是否有更好的方法來做到這一點？ https://codereview.stackexchange.com/ – Mathletics

大部分，是的。我讀過，調用內聯函數是一個禁忌，這讓我想知道其他人是如何完成它的。直覺通常不會讓我保持良好的狀態 - 足夠單獨。感謝您的鏈接。 –

我認爲你可以使用角度和數據綁定：

所以，你可以只用一個指令，並自動綁定容易從服務器端的JSON對象的HTML元素。

但是，您應該開始研究角度。

你可以開始尋找在這裏做的東西你優雅的方式： https://docs.angularjs.org/tutorial/step_04

我希望這是有益的。

來源

2015-09-04 17:53:36

動態jQuery對話從循環內傳遞JSON對象

回答

相關問題