-1

我正在尝试使用closest()获取<input>不同 div 中的元素。这是标记：

<div class="row">
    <div class="span8">
        <input type="text" disabled="disabled" id="image-name">
    </div>
    <div class="span4">
        <input type="file">
    </div>
</div>

这是脚本

$(document).ready(function(){
    $("input:file").change(function (){
       var fileName = $(this).val();
       //Put the file name inside the disabled <input>
       $(this).closest('input:disabled').val(fileName);
    });
});

但它什么也没做。我尝试更改input:disabled为，#image-name但仍然无法正常工作。

有什么解决办法吗？

谢谢

4

4 回答 4

5

如果您在另一个 INPUT 元素上有一个 id，为什么要使用最接近的函数？为什么不只是 $('#image-name')？最接近的方法并不像您想的那样起作用。最接近的总是沿着 DOM 树向上，直到找到匹配项。

根据对我最初建议的评论，您可以使用更精美的 jQuery 事件绑定器版本来获得 DRY：

function handler(e, args) {
    $(e.data.elem).val(fileName);
}

$('input:file').bind('change', { elem: '#image-name' }, handler);
$('#other-input').bind('change', { elem: '#other-field' }, handler);

使用事件数据构造参数化的可重用事件处理程序。

于 2013-05-14T03:05:02.390 回答
1

因为closest向上移动，而不是侧向移动。只是为了添加，它也开始匹配当前元素。

一种更通用的方法是用于closest查找共同的祖先，即.row，以及find从那里禁用的文本框。你也可以做parent, prevand children，假设 HTML 总是这样。

于 2013-05-14T03:04:34.443 回答
1

用于closest获取根 parent ，然后使用 find。

$(this).closest('.row').find('input[disabled]').val(fileName);

试试这个

刚才注意到你的输入有 ID 所以你可以做$('#image-name').val(fileName)

于 2013-05-14T03:04:44.657 回答
1

您可以使用：

$(this).closest('.row').find('input:disabled').val(fileName);

因为closest()将遍历它在 DOM 树中的祖先。

于 2013-05-14T03:05:51.520 回答