javascript - 使用 jQuery 追加

Question

好吧，这是一篇很长的文章。我有一个多个 DOM 树结构，需要遍历它才能插入图像。根据记录，图像会很好地传递到 PARAM 中。我不明白的是为什么它不发布。所以，这是我当前使用的代码。

function validateImage(event) {
    var $input = $(this);
    var width = 75;
    var height = $input.closest('.logo-block').length > 0 ? 35: 75;
    $input.animate({
        'backgroundColor': '#999'
    },
    250);
    $.get('/meta/thumbnail/' + $input.val() + '/' + height + '/' + width + '/',
    function(result) {
        $input.stop();
        if (result != 'No Image Available') {
            $input.css('background-color', '#55FF00');
            var $block = $input.closest('div.thumb-image');
            if ($block.closest('.center-callout-info').length > 0) {
                // in center column, add image.
                $input.val('');
                $('<div class="thumb">' + result + '</div>').appendTo($block.closest('.image-container').not($block.closest('.more-images .image-container'))).find('img').addClass('selected');
            $('.center-callout-info .block img.meta-thumb').click(bindImageSelection);
            }
        } else {
            $input.css('background-color', '#FF0000');
            $input.val('');
        }
        $input.animate({
            backgroundColor: '#FCFCFD'
        },
        2000);
    });
}

HTML 如下:

<fieldset class="collapsible collapsed">
    <legend class="collapse"><a href="#">Image Management</a></legend>
    <div class="fieldset-wrapper"><input type="button" value="Save Images" id="saveForm" class="submitButton" name="save" />
        <div class="center-callout-info">
            <div class="callout-images">
                <div class="high-res block active-tab" id="46051">
                    <div class = "image-container">
                        <div class="thumb-image thumb selected" id="AVE_BOX_TOPS_EDUCATION_4C">
                        <img class="meta-thumb" height="" src="/thumbs/AVE_Box_Tops_Education_4C.png" title="AVE_BOX_TOPS_EDUCATION_4C" /></div>
                    <div class="thumb-image thumb selected" id="FEL_BANKERS_BOX_BLK">
                        <img class="meta-thumb" height="" src="/thumbs/FEL_BANKERS_BOX_BLK.png" title="FEL_BANKERS_BOX_BLK" /></div>
                    <div class="thumb-image thumb selected" id="FEL_BB_FOLDER_RAILS_BLK">
                        <img class="meta-thumb" height="" src="/thumbs/FEL_BB_Folder_Rails_BLK.png" title="FEL_BB_FOLDER_RAILS_BLK" /></div>
                    <div class="thumb-image thumb selected" id="FEL_SFI_BLK">
                        <img class="meta-thumb" height="" src="No Image Available" title="FEL_SFI_BLK" /></div>
                    <form action="/node/46051/edit"  accept-charset="UTF-8" method="post" id="skuimage-get-more-form">

                        <div><div class="form-item" id="edit-new-high-res-wrapper">
                        <label for="edit-new-high-res">New: </label>
                        <input type="text" maxlength="128" name="new_high_res" id="edit-new-high-res" size="15" value="AVE_AVERY_BLK" class="form-text new-button" />
                        </div>
                        <input type="hidden" name="form_build_id" id="form-de9c77d3f4d32257a52dc609e6697769" value="form-de9c77d3f4d32257a52dc609e6697769"  />
                        <input type="hidden" name="form_token" id="edit-skuimage-get-more-form-form-token" value="f7bb86ba8678fa2fb5b911f1df819bec"  />
                        <input type="hidden" name="form_id" id="edit-skuimage-get-more-form" value="skuimage_get_more_form"  />

                        </div></form>
                        </div></div></div></div></div></fieldset>

现在，我想要 <IMG>与其他人一起出现<IMG> ，位于类 image-container 的 div 内部.

我想我已经在邮件中包含了所有内容。任何帮助都会很棒。

编辑编辑编辑编辑编辑编辑编辑

答案如下:

好吧，这就是答案。在上面您将看到以下代码行:

var $block = $input.closest('div.thumb-image');

但是，在遍历 DOM 树之后，我发现我需要将其设置为我想要放置图像的实际位置。所以，var $block实际上是以下内容:

var $block = $input.closest('.image-container');

之后，我还必须更改放置图像的位置。

$('<div class="thumb">' + result + '</div>').appendTo($block).find('img').addClass('selected');

Answer 1

我不太清楚你的帖子。但如果了解一点，它是关于发送图像并从应用程序后端获取响应。 如果我错了，我很抱歉，但如果我是对的。那么这是我的答案——

您无法使用ajax上传文件。也就是说，您不能在 $.ajax()、$.get()、$.post() 等函数中将文件作为数据发送。