jQuery的.end()在.contents()之后不能按预期工作吗? [英] jQuery's .end() doesn't work as expected after .contents()?
问题描述
a = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").remove().end().text()
b = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").text()
c = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").empty().end().text()
d = $("table").clone().text()
$("#a").text(a)
$("#b").text(b)
$("#c").text(c)
$("#d").text(d)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tbody>
<tr>
<td>Foo</td>
<td>
<p>
<span><input type="checkbox" disabled="disabled">1</span>
<span><input type="checkbox" disabled="disabled" checked="checked">2</span>
<span><input type="checkbox" disabled="disabled">3</span>
</p>
</td>
</tr>
</tbody>
</table>
A: <span id="a"></span><br/>
B: <span id="b"></span><br/>
C: <span id="c"></span><br/>
D: <span id="d"></span><br/>
EXPECTED: Foo 2
我的逻辑是找到删除<p>
中除已选中<input>
的<span>
之外的所有内容.然后打印出修改后的HTML的.text()
.
My logic is to find remove everything inside <p>
EXCEPT for the <span>
that has the checked <input>
. Then print out the .text()
of that modified HTML.
我知道jQuery语句部分正确,因为b
正确选择了应该删除的两个选项,即1
和3
.只是不确定如何仅使jQuery输出Foo 2
.
I know the jQuery statement is partially correct since b
correctly selects the two options that should be removed, ie 1
and 3
. Just not sure how to make jQuery output Foo 2
only.
我认为.end()
将退出" .find()
,但事实并非如此.我该如何纠正呢?还是有更好的方法呢?
I assume .end()
will "exit out" of the .find()
, but it's not. How do I correct this or is there a better way to do this?
最后,我需要没有(匿名)功能的单行jQuery语句,因为我使用的工具仅支持单行jQuery语句.嵌套很好,即$("foo").find($("bar"))
.我最终只想提取此HTML的.text(),因此我想删除未检查其相应输入的文本.
Lastly, I need a one-line jQuery statement without (anonymous) functions, since the tool I'm using only supports one-liner jQuery statements. Nesting is fine, ie $("foo").find($("bar"))
. I eventually just want to extract the .text() of this HTML, hence I want to remove the text whose respective input isn't checked.
推荐答案
我是通过反复试验随机发现的.原来我需要三个.end()
通话.
I randomly found out by trial-and-error. It turns out I needed three .end()
calls.
我猜一个关闭.not()
,一个关闭.contents
,最后一个关闭.find()
???
I guess one closes the .not()
, one closes the .contents
, and the last one closes the .find()
???
a = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").remove().end().text()
b = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").text()
c = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").empty().end().text()
d = $("table").clone().text()
answer = $("table").clone().find("p:has(input)").contents().not("span:has(input:checked)").empty().end().end().end().text()
$("#a").text(a)
$("#b").text(b)
$("#c").text(c)
$("#d").text(d)
$("#answer").text(answer)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
<tbody>
<tr>
<td>Foo</td>
<td>
<p>
<span><input type="checkbox" disabled="disabled">1</span>
<span><input type="checkbox" disabled="disabled" checked="checked">2</span>
<span><input type="checkbox" disabled="disabled">3</span>
</p>
</td>
</tr>
</tbody>
</table>
A: <span id="a"></span><br/>
B: <span id="b"></span><br/>
C: <span id="c"></span><br/>
D: <span id="d"></span><br/>
EXPECTED: Foo 2<br/>
ANSWER: <span id="answer"><span>
这篇关于jQuery的.end()在.contents()之后不能按预期工作吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!