jQueryのクリックイベントは、同じクラスのすべてのタグに影響しています

Question

私はnode-horsemanと協力しています。私は.evaluate()とjQueryを使用して、Googleアラートのボタンにclick機能をトリガーしています。動作していますが、すべて.delete_buttonに影響しています。

各liには、一意の値を持つdata-id属性があります。 Googleアラート自体で作成されたので、node-horsemanで正しいブロックを選択し、.html()でテストすると、うまく機能し、適切なブロックを指定したdata-idで選択します。

jQuery('#manage-alerts-div li').attr('data-id', this.feedID).find('.alert_buttons').html() 

与えdata-idに基づいてアラートの検査コードは以下の通りです：

とjQueryの選択と返されたHTML：

<a href="/alerts/feeds/07997923364799863317/3782479325533077987" tabindex="0"><span class="rss_icon" title="RSS"></span></a><span class="edit_button alert_button" title="Edit" role="button" tabindex="0"></span><span class="delete_button alert_button" title="Delete" role="button" tabindex="0"></span> 

次に、私は01をクリックしようとします：

jQuery('#manage-alerts-div li').attr('data-id', this.feedID).find('.alert_buttons > .delete_button').trigger('click') 

しかし、それは全て、本.delete_buttonクラスに影響を与えることを主張。あなたが特定の属性値を持つ要素だけを選択しようとしている場合は、次のよう

Answer 1

、attribute equals selectorを試してみてください。

jQuery('#manage-alerts-div li[data-id="' + this.feedID + '"]') 
    .find('.alert_buttons > .delete_button') 
    .trigger('click'); 

はここにあなたの既存のコードが何をするかの内訳です：

jQuery('#manage-alerts-div li') 

を。 .. #manager-alerts-divのすべての要素を選択した後、

.attr('data-id', this.feedID) 

...その後、何this.feedIDへのdata-id属性があるセット、

.find('.alert_buttons > .delete_button') 

...トリガー...

.trigger('click') 

、その後、すべての '#manage-alerts-div li'要素の元のセット内の要素を検索しますすべてのクリックハンドラ

.html()は、使用したセレクタが多くの要素と一致していても、あなたのように見えるかもしれませんが、.html()がjQueryオブジェクトの最初の要素の内容のみを返すため、混乱している可能性があります。 1つの要素だけが選択されました。