在jquery中获取父类和触发器

Get parent class and trigger in jquery

本文关键字：触发器 父类 获取 jquery      更新时间：2023-09-26

我想通过单击按钮或图像来触发父类的事件。

<li class="addImage">
<input class="PhotoPicker" type="file" accept="image/*" capture="camera" onchange="angular.element(this).scope().file_changed(this)" />
<a class='imageclick' onclick=" $(this).closest('.PhotoPicker').trigger('click');">
    <img ng-src="images/add-photo.png">
</a>

在这里重复addImage类，当我单击imageclick类时，我想触发相应列表photopicker。当我使用时它工作得很好，

('.PhotoPicker').trigger('click');

请帮帮我！

他们不是彼此的祖先/后代。

您需要使用closest上升到LI（最近的共同祖先），然后向下搜索find：

$(this).closest('li').find('.PhotoPicker').trigger('click');

您还可以trigger('click')缩短为仅.click()因为它在幕后执行完全相同的操作：

$(this).closest('li').find('.PhotoPicker').click();

您可以使用同级选择器，但这对 DOM 中所做的更改并不那么可靠。 使用共同祖先并找到更安全。例如，如果出于样式目的更改了布局，并在元素周围添加了额外的 DIV，则同级搜索将失败。

最接近的向上看祖先。你想侧身去兄弟姐妹。

可以使用prev()或siblings() 

$(this).prev().trigger('click');

或

$(this).siblings('.PhotoPicker').trigger('click');

$(".imageclick").prev().trigger("click");

您可以在此处简单地使用prev选择器。https://api.jquery.com/prev/

您可以向上移动DOM以查找其父项，然后搜索所需的子项 

<li class="addImage">
    <input class="PhotoPicker" type="file" accept="image/*" capture="camera" onchange="angular.element(this).scope().file_changed(this)" />
    <a class='imageclick' onclick="someFunction()">
        <img ng-src="images/add-photo.png">
    </a>

.JS

 function(){
         $(this).parent().find('.PhotoPicker').trigger('click');
}

斯菲德尔

你应该

了解closest的用法，它的工作是向上浏览它的父元素，而不是兄弟姐妹，在你的标记中，类PhotoPicker是一个同级元素，而不是父/祖先元素。

但addImage是imageclick的父/祖先元素。因此，您可以使用这样的closest访问它;

$(this).closest('.addImage')

然后您可以使用 find 函数在其中获取 PhotoPicker 元素，如下所示：

$(this).closest('.addImage').find('.PhotoPicker').first().trigger('click')
相关文章：