javascript - JQuery:将 HTML 添加到父 Div 作为 AJAX 的结果

Question

我不太清楚如何将从 AJAX 调用中检索到的 HTML 添加到 PHP 函数。

首先，这是 AJAX 函数:

function selectListAJAX(fieldId, newclass){
    $.ajax({
        url: "http://brand.emich.edu/forms-and-tools/sections/departmental/university-archives/monthly/ajax-selectbox.php",
        type: "POST",
        data: { field_id: fieldId },
        success: function(response){
           $(newclass).html(response);
        },
        error: function(){
           alert("Error");
        }
    });
}

这里是应该添加 HTML 的地方:

$(this).parent().parent().after('
    <div class="form-group '+ field_name +'-row row">
        <div class="col-sm-6">
            <input type="text" name="'+ field_name +'[]" class="form-control item-field">
        </div>
        <div class="col-sm-3 selectajax">'+ 
            selectListAJAX(newFieldId, selectajax) +'
        </div>
        <div class="col-sm-3 add-field">
            <input type="number" name="'+ field_name +'qty[]" class="form-control align-right ' + field_name + 'qty">
        </div>
    </div>
');

我尝试了向函数添加参数等多种变体，但我能想到的最好的方法是在 div 中放置一个大的“未定义”而不是响应。

哦，如果有人能解释为什么我必须将 .after() 中的代码全部粉碎在一起以便浏览器理解它，那就加分了。我查看了以前的线程并看到带有“\”的转义行，但这似乎不起作用。

Answer 1

问题是 selectListAjax() 不返回值。对结果响应的所有处理都应该在 ajax 调用的 success() 处理程序内进行，因为 ajax 调用(根据定义)是异步的。请注意，该方法也可能在 success() 处理程序完成之前返回。

从小事做起。

尝试(html):

<div>
    <div class="target"></div>
</div>

(脚本):

$.ajax({
        url: "http://brand.emich.edu/forms-and-tools/sections/departmental/university-archives/monthly/ajax-selectbox.php",
        type: "POST",
        data: { field_id: fieldId },
        success: function(response){
           $('.target').html(response);
        },
        error: function(){
           alert("Error");
        }
    });