Jquery在点击事件输入

jquery on click event input

本文关键字：事件 输入 Jquery      更新时间：2023-09-26

想象一下:我有多个带有attr "data-question-id"的div，在这个div中，我有一个或多个输入，可能有也可能没有attr "has-next-question"。请看下面的例子:

<div data-question-id="5">
<input type="radio" has-next-question="true" value="2"> test1
<input type="radio" value="3"> test2
</div>
<div data-question-id="6">
<input type="radio" has-next-question="true" value="5"> test3
<input type="radio" has-next-question="true" value="7"> test4
</div>

正如你在第一个div中看到的，它有两个输入，但是其中一个没有"has-next-question"。我的问题是，我怎么能绑定一个点击事件的输入有一个父div与attr "data-question-id"和这个div至少有一个输入与attr "has-next-question"。

我已经完成了:

$(document).on('click', 'div[data-question-id] input', function(e) {
          alert('click');
});

帮忙吗?由于人

编辑:更改了attr "has-next-question"，因为它是一个无效的html属性。

想象一下:如果我点击"test1"，它应该触发事件，但如果我点击"test2"，它也应该触发事件，因为带有attr"data-question-id"的父div至少有一个带有attr"has-next-question"的输入，对应于"test1"。如果父div中没有带attr "has-next-question"的输入，则不应该触发该事件。

您已经为div做过了，所以请重复。

div[data-question-id] input[has-next-question]

这不是正确的html。has-next-question不是一个有效的属性。

但这应该可以，

$(document).on('click', 'div[data-question-id] input[has-next-question]', function(e) {
          alert('click');
});

编辑:(修改原题后)，

不，你不能用它创建一个选择器。jQuery使用CSS选择器，它们不能从子元素到父元素。

但是，你可以这样做，

$(document).on('click', 'div[data-question-id] input', function(e) {
       if($(this).parent().find('[has-next-question]').length === 0 ) return;
       // Other code which needs to be executed.
});

。如果父级没有[has-next-question]属性的子级，则从函数中出来。

扩展你的选择器:

$(document).on('click', "div[data-question-id] input[has-next-question='true']", function(e) {
          alert('click');
});
相关文章：