更改许多元素的innerhtml

时间:2016-10-25 18:18:17

标签: jquery jquery-selectors

我有一个ajax调用,我用它来填充一个表,在另一个页面上查询结果。它有效,但是我要做另一个类似的ajax调用,这种必须做=CONCATENATE(L1,M1) in N1 =CONCATENATE(O1,P1) in Q1 的结构让我发疯,但我似乎无法弄清楚如何绕过它

也许使用$(#Whatever_Selector).html(result[0]['Whatever_Index'])并使用.each的内容,但我不知道。

我的剧本:

$(this)

我即将填充另一张包含数百 $('#selection_project').change(function(event) { $.post('info.php', { selected_project: $('#selection_project option:selected').val()}, function(data) { var result = JSON.parse(data); var project = result['selected_project']; $('#CTN').html(\"CTN - \"+project); $('#Global_Project_Number').html(result[0]['Global_Project_Number']); $('#Project_Type').html(result[0]['Project_Type']); $('#Lead_Location').html(result[0]['Lead_Location']); $('#Local_Project_Number_1').html(result[0]['Local_Project_Number_1']); $('#Local_Project_Number_2').html(result[0]['Local_Project_Number_2']); $('#Local_Project_Number_3').html(result[0]['Local_Project_Number_3']); $('#Local_Project_Number_4').html(result[0]['Local_Project_Number_4']); $('#Local_Project_Number_5').html(result[0]['Local_Project_Number_5']); $('#Development_Location_2').html(result[0]['Development_Location_2']); $('#Development_Location_3').html(result[0]['Development_Location_3']); $('#Development_Location_4').html(result[0]['Development_Location_4']); $('#Development_Location_5').html(result[0]['Development_Location_5']); $('#Customer').html(result[0]['Customer']); $('#Duration').html(result[0]['Duration']); $('#Customer_Group').html(result[0]['Customer_Group']); $('#Average_Number_of_Pieces').html(result[0]['Average_Number_of_Pieces']); $('#Project_Name').html(result[0]['Project_Name']); $('#State').html(result[0]['State']); $('#BU_CC').html(result[0]['BU_CC']); $('#Start_Of_Production').html(result[0]['Start_Of_Production']); $('#Outlet').html(result[0]['Outlet']); $('#End_Of_Development').html(result[0]['End_Of_Development']); $('#Start_Of_Development').html(result[0]['Start_Of_Development']); $('#Project_Connection').html(result[0]['Project_Connection']); $('#Project_Manager').html(result[0]['Project_Manager']); $('#Chance_Budget').html(result[0]['Chance_Budget']); $('#System_TPL').html(result[0]['System_TPL']); $('#Chance_Forecast').html(result[0]['Chance_Forecast']); $('#Product_Family').html(result[0]['Product_Family']); $('#Technology').html(result[0]['Technology']); $('#LL_SW').html(result[0]['LL_SW']); $('#Processor_Type').html(result[0]['Processor_Type']); $('#HL_SW').html(result[0]['HL_SW']); $('#Chassis_Type').html(result[0]['Chassis_Type']); $('#Technology_Development').html(result[0]['Technology_Development']); $('#Technical_Description').html(result[0]['Technical_Description']); $('#username').html(result[0]['username']); $('#Milestone_1').html(result[0]['Milestone_1']); $('#Milestone_2').html(result[0]['Milestone_2']); $('#Milestone_3').html(result[0]['Milestone_3']); $('#Milestone_4').html(result[0]['Milestone_4']); $('#Milestone_5').html(result[0]['Milestone_5']); $('#Milestone_6').html(result[0]['Milestone_6']); $('#Due_Date_1').html(result[0]['Due_Date_1']); $('#Due_Date_2').html(result[0]['Due_Date_2']); $('#Due_Date_3').html(result[0]['Due_Date_3']); $('#Due_Date_4').html(result[0]['Due_Date_4']); $('#Due_Date_5').html(result[0]['Due_Date_5']); $('#Due_Date_6').html(result[0]['Due_Date_6']); } ); }); 张的桌子,我不想使用上述格式!

如何在Jquery选择器中使用某种循环来使用数组的索引?

2 个答案:

答案 0 :(得分:0)

特别针对您的用例(使用给定信息),您可以使用$.each来迭代对象的属性:

$.each(result[0], function(key, value) {
  $('#' + key).html(value);
});

假设所有值都具有相应的id元素。

答案 1 :(得分:0)

只需通过一个简单的循环遍历您的result[0]对象。

$('#selection_project').change(function(event) {
    $.post(
        'info.php',
        {selected_project: $('#selection_project option:selected').val()},
        function(data) {
            var result = JSON.parse(data);
            var project = result['selected_project'];
            result = result[0];
            $('#CTN').html('CTN - ' + project); 
            for (el in result) {
                if ($('#' + el).length) {
                    $('#' + el).html(result.el);
                }
            }
        }
    );
});