blocks|key|2739028|text|这个怎么样：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2739029|function+setHover(+param+){
+++$("#homelink"+%2B+param).hover(
++++function()+{+$("#poptext"+%2B+param).show();+},
++++function()+{+$("#poptext"+%2B+param).hide();+}
++);
}|code-block|syntax|javascript|2739030|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

How about this:

<pre><code>function setHover( param ){
 $("#homelink" + param).hover(
 function() { $("#poptext" + param).show(); },
 function() { $("#poptext" + param).hide(); }
 );
}
</code></pre>

blocks|key|2739056|text|#poptext元素是它们各自的#homelink的子元素吗？如果是这样，您可以创建一个"homelink“类和一个"poptext”类，然后执行如下操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2739057|$(".homelink+.poptext").hover(
++++function()+{+$(this).show();+},
++++function()+{+$(this).hide();+}
});|code-block|syntax|javascript|2739058|顺便提一句，jQuery中的大多数函数在对象集合上的工作效果与它们在单个对象上所做的一样好。在这种情况下，即使$(".homelink+.poptext")返回一个对象集合，但每个对象都分别与mouseover和mouseout处理程序关联。|2739059|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Are the #poptext elements children of their respective #homelink? If so, you could create a "homelink" class and a "poptext" class and then do something like the following:

<pre><code>$(".homelink .poptext").hover(
 function() { $(this).show(); },
 function() { $(this).hide(); }
});
</code></pre>

As a side note, most functions in jQuery work just as well on collections of objects as they do on a single one. In this case, even though $(".homelink .poptext") is returning a collection of objects, each one is individually associated with a mouseover and mouseout handler by hover().

blocks|key|1315888|text|我可能会尝试以下几种方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1315889|$('.homelink').bind('hover',+function(){
++++$('.poptext',+this).toggleClass('hide');
});

#+and+some+CSS

.hide+{
++++display:+none
}|code-block|syntax|javascript|1315890|将悬停事件绑定到一个通用类名，而不是试图弄清楚如何将其绑定到#homelink{somenumber}和#poptext{somenumber}。如果需要的话，保持ids的位置(例如，对钩子的样式设置)，但是要简化事情并使用类。|1315891|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I'd probably try something like the following:

<pre><code>$('.homelink').bind('hover', function(){
 $('.poptext', this).toggleClass('hide');
});

# and some CSS

.hide {
 display: none
}
</code></pre>

Bind the hover event to a generic classname, rather than trying to figure out how to hackishly bind it to #homelink{somenumber} and #poptext{somenumber}. Keep your ids in place if you must (for styling hooks for example), but simplify things and use classes.

blocks|key|2739123|text|您可以使用regexp从悬浮的homelink中获取数字，然后切换相关的poptext。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2739124|试试看：+http://jsfiddle.net/xFR3s/|BOLD|2739125|$("#homelink1,#homelink2").hover(+function()+{+
++++$("#poptext"+%2B+this.id.match(/\d%2B$/)[0]).toggle();+
});​|code-block|syntax|javascript|2739126|您可以使用homelink元素的“开始”选择器使其更短。效率较低，但它只在DOM负载上运行一次，所以也许可以。|2739127|试试看：+http://jsfiddle.net/xFR3s/1/|2739128|$("[id%5E=homelink]").hover(+function()+{+
++++$("#poptext"+%2B+this.id.match(/\d%2B$/)[0]).toggle();+
});​|2739129|2739130|编辑：--如果你不想马上解释它，我想我会这样做：|2739131|试试看：+http://jsfiddle.net/xFR3s/2/|2739132|$("[id%5E=homelink]").each(function()+{
++++var+num+=+this.id.match(/\d%2B$/)[0];
++++$(this).hover(+function()+{+
++++++++$("#poptext"+%2B+num).toggle();+
++++});​
});|2739133|或者这个：|2739134|试试看：+http://jsfiddle.net/xFR3s/3/|2739135|$("[id%5E=homelink]").each(+function()+{
++++$(this).hover(+setUpHover(this.id.match(/\d%2B$/)[0])+);
});

function+setUpHover(num)+{
++++return+function()+{
++++++++$("#poptext"+%2B+num).toggle();+
++++};
}​|2739136|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/xFR3s/|1|http://jsfiddle.net/xFR3s/1/|2|http://jsfiddle.net/xFR3s/2/|3|http://jsfiddle.net/xFR3s/3/^0|F|8|10|7|0|0|4|5|Q|0|0|0|5|8|0|0|4|5|S|1|0|0|0|0|3|0|0|4|5|S|2|0|0|0|0|4|5|S|3|0|0^^$0|@$1|2|3|4|5|6|7|1K|8|@$9|1L|A|1M|B|C]|$9|1N|A|1O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1P|8|@$9|1Q|A|1R|B|H]]|D|@$9|1S|A|1T|1|1U]]|E|$]]|$1|I|3|J|5|K|7|1V|8|@]|D|@]|E|$L|M]]|$1|N|3|O|5|6|7|1W|8|@$9|1X|A|1Y|B|C]]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1Z|8|@$9|20|A|21|B|H]]|D|@$9|22|A|23|1|24]]|E|$]]|$1|R|3|S|5|K|7|25|8|@]|D|@]|E|$L|M]]|$1|T|3|-4|5|6|7|26|8|@]|D|@]|E|$]]|$1|U|3|V|5|6|7|27|8|@$9|28|A|29|B|H]]|D|@]|E|$]]|$1|W|3|X|5|6|7|2A|8|@$9|2B|A|2C|B|H]]|D|@$9|2D|A|2E|1|2F]]|E|$]]|$1|Y|3|Z|5|K|7|2G|8|@]|D|@]|E|$L|M]]|$1|10|3|11|5|6|7|2H|8|@]|D|@]|E|$]]|$1|12|3|13|5|6|7|2I|8|@$9|2J|A|2K|B|H]]|D|@$9|2L|A|2M|1|2N]]|E|$]]|$1|14|3|15|5|K|7|2O|8|@]|D|@]|E|$L|M]]|$1|16|3|-4|5|6|7|2P|8|@]|D|@]|E|$]]]|17|$18|$5|19|1A|1B|E|$1C|1D]]|1E|$5|19|1A|1B|E|$1C|1F]]|1G|$5|19|1A|1B|E|$1C|1H]]|1I|$5|19|1A|1B|E|$1C|1J]]]]

You could use a regexp to get the number from the <code>homelink</code> that was hovered, then toggle the associated <code>poptext</code>.

Try it out: <a href="http://jsfiddle.net/xFR3s/" rel="nofollow noreferrer">http://jsfiddle.net/xFR3s/</a>

<pre><code>$("#homelink1,#homelink2").hover( function() { 
 $("#poptext" + this.id.match(/\d+$/)[0]).toggle(); 
});​
</code></pre>

You could make it shorter with a "starts with" selector for the <code>homelink</code> elements. Less efficient, but it only runs once on DOM load, so perhaps it's alright.

Try it out: <a href="http://jsfiddle.net/xFR3s/1/" rel="nofollow noreferrer">http://jsfiddle.net/xFR3s/1/</a>

<pre><code>$("[id^=homelink]").hover( function() { 
 $("#poptext" + this.id.match(/\d+$/)[0]).toggle(); 
});​
</code></pre>

<hr>

EDIT: If you don't want it interpreted on the fly, I guess I'd do something like this:

Try it out: <a href="http://jsfiddle.net/xFR3s/2/" rel="nofollow noreferrer">http://jsfiddle.net/xFR3s/2/</a>

<pre><code>$("[id^=homelink]").each(function() {
 var num = this.id.match(/\d+$/)[0];
 $(this).hover( function() { 
 $("#poptext" + num).toggle(); 
 });​
});
</code></pre>

or this:

Try it out: <a href="http://jsfiddle.net/xFR3s/3/" rel="nofollow noreferrer">http://jsfiddle.net/xFR3s/3/</a>

<pre><code>$("[id^=homelink]").each( function() {
 $(this).hover( setUpHover(this.id.match(/\d+$/)[0]) );
});

function setUpHover(num) {
 return function() {
 $("#poptext" + num).toggle(); 
 };
}​
</code></pre>

blocks|key|1315940|text|为什么不用类创建一个元素，这样就可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1315941|jQuery('.homelink').each(function()+{
++++var+me+=+jQuery(this);
++++var+target+=+me.find('.poptext');+//if+the+target+is+'poptext'+class
++++me.hover(
++++++++function()+{
+++++++++++target.show();
++++++++},
++++++++function()+{
++++++++++++target.hide();
++++++++}
++++);
});|code-block|syntax|javascript|1315942|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

why don't you create an element with a class 
so you can do like this :

<pre><code>jQuery('.homelink').each(function() {
 var me = jQuery(this);
 var target = me.find('.poptext'); //if the target is 'poptext' class
 me.hover(
 function() {
 target.show();
 },
 function() {
 target.hide();
 }
 );
});
</code></pre>

Posting as a jquery newbie. I am sure there must be a way to condense the code below in a DRY fashion. Essentially this is just a show/hide that is applied to multiple elements on a page, all using the same template and naming conventions:

<pre><code>$("#homelink1").hover(
 function() { $("#poptext1").show(); },
 function() { $("#poptext1").hide(); }
);

$("#homelink2").hover(
 function() { $("#poptext2").show(); },
 function() { $("#poptext2").hide(); }
);
...
</code></pre>

I'm stuck on how to convert this to a function with passed parameters, so that I could just pass the integer (1 or 2) and have the function evaluate the rest, e.g.

<code>$("#homelink" + param).hover</code>

DRY programming with jquery

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

以jquery新手的身份发布。我相信一定会有一种方法，以干燥的方式压缩下面的代码。本质上，这只是一个显示/隐藏，应用于一个页面上的多个元素，所有这些元素都使用相同的模板和命名约定：$("#homelink1").hover(    function() { $("#poptext1").show(); },    fu...

问用jquery进行干式编程
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用jquery进行干式编程EN