Question

我正在尝试附加remove和submit按钮来提交和删除div，但div没有收到按钮：

<div class="container" style="width:80%">
<div class="panel panel-default">
    <div class="panel-heading">Image ID
        <div class="btn-group btn-group-sm pull-right">
            <div class="btn btn-default submit-button">SUBMIT <span class="glyphicon glyphicon-plus"></span>
            </div>
            <div class="btn btn-danger remove-button">REMOVE <span class="glyphicon glyphicon-remove-circle"></span>

            </div>
        </div>
    </div>
</div>

$(function () {
$removeButton = $('<button class="btn btn-default remove">')
    .text('Remove ' + imageid.value).appendTo($(".remove-button"))
    .on('click', function () {
    panel.remove();
    $(this).remove();
    return false;
});


$submitButton = $('<button class="btn btn-default submit"></div>')
    .text('Submit ' + imageid.value).appendTo($(".submit-button"))
    .on('click', function () {
    var saveImage = encodeURIComponent(dataUrl);
    jQuery.ajax({
        type: "PUT",
        url: 'url.com' + imageid.value + "/" + saveImage,
        //data: JSON.stringify(data),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            var jsonObj = jQuery.parseJSON(data);
            alert(jsonObj);
        },
        failure: function (errorMsg) {
            alert(errorMsg);
        }
    });
  });
});

当前实施：jsFiddle

Answer 1

尝试：

$(".remove-button").append("<button class='btn btn-default remove'>Remove " + imageid.value + "</div>");
$(".submit-button").append("<button class='btn btn-default submit'>Submit " + imageid.value + "</div>");

$(document).on('click','.remove', function(){
    panel.remove(); 
    $(this).remove();
    //or $(this).closest(".panel-heading").remove();
});

$(document).on('click','.submit', function(){
    var saveImage = encodeURIComponent(dataUrl);
    jQuery.ajax({
        type: "PUT",
        url: 'url.com' + imageid.value + "/" + saveImage,
        //data: JSON.stringify(data),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            var jsonObj = jQuery.parseJSON(data);
            alert(jsonObj);
        },
        failure: function (errorMsg) {
            alert(errorMsg);
        }
    });
});

使用jquery将动态按钮附加到div

1 个答案: