jquery - 仅适用于包含 div 的元素的选择器

Question

我有几个在文件上传后动态生成的 div。每个文件上传都会创建一个以下格式的 div:

<div id="uploadifive-fileupload-queue" class="uploadifive-queue">
    <div class="uploadifive-queue-item complete" id="uploadifive-fileupload-file-0">

        <div class="inputs">

            <input type="hidden" name="image_id" value="0">
            <input type="text" name="alt-text">
            <input type="submit" name="image_data_submit" value="Submit" />

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

上传的每个项目都会将 uploadifive-queue-item 类的 id 增加到 uploadifive-fileupload-file-0、uploadifive-fileupload-file-1、uploadifive-fileupload-file-2 等。

我从响应中动态填充隐藏的 image_id，因此每个隐藏的 image_id 字段将具有与我存储在数据库中的 image_id 相对应的不同数值。这看起来像:

'onUploadComplete'  : function(file, data) {    
     $('input[name=image_id]:last').val(data);
}

我试图用一些文本填写替代文本输入字段，然后单击“提交”按钮时，它会通过 ajax 将命令发送到数据库，在数据库中更新 image_id 所在数据库中的替代文本字段匹配。

问题是我不知道如何使“提交”按钮仅提交同一 div 容器中的 image_id 和 alt-text。每个 div 都有一个唯一的 ID 和一个递增的数字，但我不知道如何选择它。我该怎么做？

基本上，如果提交了 uploadifive-fileupload-file-3 中的按钮，我只希望通过 ajax 提交 uploadifive-fileupload-file-3 中的 image_id 字段。

这是我当前使用 jQuery ajax 的方式:

$("button[name=image_data_submit]").click(function(){
        $.ajax({
            url: './update_image/',
            type: "POST",
            data: { 
                image_id: $("input[name=image_id]").val(), 
                alt_text: $("input[name=alt_texted]").val() 
            },
            success: function(response){
                console.log(response);
            }
        });
    });

如果有任何帮助，我将不胜感激。一整天都被困在这个问题上:/

Answer 1

尝试根据单击元素的位置选择值。

$("button[name=image_data_submit]").click(function(){
    var theDiv = $(this).closest(".uploadifive-queue");
    $.ajax({
        url: './update_image/',
        type: "POST",
        data: { 
            image_id: $("input[name=image_id]",theDiv).val(), 
            alt_text: $("input[name=alt_texted]",theDiv).val() 
        },
        success: function(response){
            console.log(response);
        }
    });
});

有趣的是...您正在选择一个按钮，但您的按钮实际上是 type=submit 的输入。这个点击事件到底有效吗？