Question

我想从DOM中访问一个元素，其父元素是我当前元素的父元素的子元素.Messed？
看这里：

<div class="tr2">
    <div class="td1">
        <input type="checkbox" value="" name="" />
    </div>
    <div class="td2">${index.getKey()[1]}
        <input type="hidden" name="upc" value="${index.getKey()[0]}" id="upc${index.getKey()[0]}" />
    </div>//i want to access this hidden input
    <div class="td3">
        <input type="text" name="categoryInput${counter+1 }" value="${index.getValue().toString().replace('[','').replace(']','');}" class="input" id="ct-input${counter+1 }" placeholder="Select your Category" />
    </div>//from event of this textfield
    <div class="td4"><i class="fa fa-check"></i>
    </div>
</div>

我想从td2中的文本输入事件访问td3中的隐藏输入。
注意：所有这些都在循环中，因此不建议任何绝对元素路径可能是我搞砸了我的问题随时编辑或建议。
提前致谢

Answer 1

我认为解决方法是找到最接近的tr2元素，然后在其中找到.td2 input元素

$(this).closest('.tr2').find('.td2 input')

Answer 2

使用.closest()

$('.td3 input').change(function(){
    $(this).closest('.tr2').find('input:hidden');
});

参考

.find()

:hidden

Answer 3

$(".tr2").on("click","td3.input[type='text']",function(){

$(this).closest(".tr2").find(".td2 input:hidden");//here you get hidden input
});

使用 closest() 和 :hidden

Answer 4

$('.tr2 .td2 input')

这个选择器可以帮助你

Answer 5

$(this).parent().prev().children('input[type=hidden]')

Answer 6

尝试这样的事情。

            $('.td3 input').change(function(){
                  $(this).parent().prev().find('input:hidden')//will give you hidden element
            });

Answer 7

更新

您可以使用最近解决方案或在文本框元素上添加其他属性（例如，hidden-target-id是隐藏输入的ID）：

<input hidden-target-id="upc${index.getKey()[0]}" type="text" name="categoryInput${counter+1 }" value="${index.getValue().toString().replace('[','').replace(']','');}" class="input" id="ct-input${counter+1 }" placeholder="Select your Category" />

-

$('input[type=text]').on('change', function() {
    var yourHiddenInput = $("#" + $(this).attr('hidden-target-id'));
});

得到相对元素jQuery

7 个答案: