jQuery的 - 寻找一个更好的选择语法

我有HTML代码，大致是这样的：jQuery的 - 寻找一个更好的选择语法

<li id="someid-11"> 

<img src="..." alt="alt" /> 
<h2><a href="somelink"> sometext </a> 
    <span><a class="editcontent" href="?action=editme">Edit</a></span> 
</h2> 
<div id="11" class="content"> 
<!-- // content goes here --> 
<div class="bottom_of_entry"> </div> 

</li>

我使用a.editcontent以激活DIV编辑就地方法。内容。我现在的选择是这样的

jQuery('a.editcontent').bind('click', (function(){ 
    jQuery(this).parent('span').parent('h2').next('.content').trigger('edit'); 
}

它的工作原理，但它的丑陋。必须有一些更好的方式来做到这一点，对吧？

来源

2008-12-17 yoavf

只是一个快速注意，DOM ID必须以字母开头;因此id =“11”在许多浏览器中不起作用。 – Funka 2009-06-23 23:35:48

我推荐Sprintstar解决方案。但如果你不喜欢它，使用：

$("a.editcontent").click(function(){ 
    $(this).parents("h2").next(".content").trigger("edit"); 
});

如果你有一个以上的“H2”：

$("a.editcontent").click(function(){ 
    $(this).parents("h2:first").next(".content").trigger("edit"); 
});

来源

2008-12-17 14:34:43 Ata

您可以使用xpath一次性从A到DIV？

编辑：显然XPath选择是没有更多的jQuery（感谢在评论的家伙指出这一点）

来源

2008-12-17 09:51:38 benlumley

还没有从更新版本的jQuery中删除xpath选择器？ – 2008-12-17 09:53:53

什么是xpath？ :)（现在使用谷歌搜索） – yoavf 2008-12-17 10:18:57

哦...看起来他们已被删除是的！ – benlumley 2008-12-17 13:13:52

，岂不是更好的ID存储在的链接，然后在你的投手，发现内容div由id，并做你的触发器？这样你就不会被绑定到特定的层次结构。

来源

2008-12-17 09:57:58 Sprintstar

我认为使用一些元属性会是一个更好的解决方案。

<li id="someid-11"> 

<img src="..." alt="alt" /> 
<h2><a href="somelink"> sometext </a> 
    <span><a rel="11" class="editcontent" href="?action=editme">Edit</a></span> 
</h2> 
<div id="11" class="content"> 
<!-- // content goes here --> 
<div class="bottom_of_entry"> </div> 

</li>

（增加了相对= “11” 的链接）

然后在JavaScript：

$('a.editcontent').click(function() 
{ 
    $('#' + $(this).attr('rel')).trigger('edit'); 
});

来源

2008-12-17 10:08:24 okoman

请注意，这会打破（X）HTML验证，因为“11”不是rel的有效值。（你决定这对你自己有多重要）。在任何情况下，你都不能有一个以数字开头的id--这会在IE中破解。用任意字符串作为前缀。 – nickf 2009-01-14 06:26:25

从我脑袋：

$("a.editcontent").click(function(){ 
    $(this).parents("h2").slice(0, 1).next(".content").trigger("edit"); 
});

来源

2008-12-17 13:33:21 svinto

我同意Sprintstart

var clickHandler = function (link) { 
    $(link.data.action).trigger("edit"); 
} 

$('a.editconent').bind('click', {action:'.content'}, clickHander);

然后，您可以更多地关注触发编辑事件的jQuery语句。

来源

2008-12-17 14:18:46

我认为它难以阅读，因为你不必去了从一个元素回落到另一个元素。如果你从一个公共容器引用这两个路径，那么这些路径看起来会更有意义。

var listitem11 = $("#someid-11"); 

listitem11.find('a.editcontent').bind('click'), (function(){ 
    listitem11.find('.content').trigger('edit'); 
}

现在我怀疑你有多个列表项处理，在这种情况下，你需要一个封闭循环，你以前不需要一个。不过我认为这让你领先。

来源

2010-07-07 06:30:44

jQuery的 - 寻找一个更好的选择语法

回答

相关问题