我试图使用jquery的find函数改变li里面的span的显示属性....它不工作,我想我知道为什么....因为span不在输入元素内部?但我不知道如何解决它
继承我的代码:
$('form ul li input').click(function() {
if ($(this).is(':checked'))
$(this).find('span').attr('display', 'block');
else
$(this).find('span').attr('display', 'none');
});
我知道我需要做的就是让它搜索LI而不是INPUT ....但我不知道该怎么做。
继承人的HTML:
<li>
<input type="checkbox" name="attack_strategies[]" id="strategy_4" value="4" />
<label for="strategy_4">meditation</label>
<span>
<select name="attack_strategies_e[]" id="strategy_e_4">
<option value="">How effective was it?</option>
<option value="0">0</option>
<option value="1">1</option><option value="2">2</option>
<option value="3">3</option><option value="4">4</option>
<option value="5">5</option><option value="6">6</option>
<option value="7">7</option><option value="8">8</option>
<option value="9">9</option><option value="10">10</option>
</select>
</span>
</li>
答案 0 :(得分:10)
你是对的。实际上,input
element [HTML4 spec]不能有任何孩子:
<!ELEMENT INPUT - O EMPTY -- form control -->
您可以使用closest
[docs]查找祖先li
,然后从那里搜索span
:
$(this).closest('li').find('span').css('display', 'block');
可能还有其他方法可以找到span
,但这取决于您的HTML结构,我们不知道。
答案 1 :(得分:0)
在您发布的代码中,此引用输入字段,.find()
文档显示:
描述:获取当前匹配元素集中每个元素的后代,由选择器,jQuery对象或元素过滤。
因此,您不能在输入字段中使用find,因为它可能没有span
子项。
您可以使用Felix Kling建议的内容。