jquery var仅定义第一个元素

Question

我有一个jquery var的问题，我很困惑.. 由于变量“id”，我创建了一个var，但它仅影响第一个元素：

jQuery的：

var butInfo = $(".but > div").attr("id");

$("#" + butInfo).each(function(){
    $(this)
        .mouseenter(function(){
            $(".txt").hide();
            $(".txt."+butInfo).show();})
        .mouseleave(function(){
            $(".txt."+butInfo).hide();});
});

HTML：

<div class="but">
    <div id="a">A</div>
    <div id="b">B</div>
    <div id="c">C</div>
</div>
<div class="txt a">A A A A A</div>
<div class="txt b">B B B B B</div>
<div class="txt c">C C C C C</div>

http://jsfiddle.net/74FYW/

如您所见，只有第一个div id="a"正在运行，而其余的仍无法正常工作。 为什么会这样？!!

更新 的 ========== 我终于找到了我想要的东西。 解决方案只是将jquery函数之后的var行放在它之前;

这就是我的意思：

$(".but > div").each(function(){
  var butInfo = $(this).attr("id"); 
  $(this)
    .mouseenter(function(){
      $(".txt").hide();
      $(".txt."+butInfo).show();
    })
    .mouseleave(function(){
      $(".txt."+butInfo).hide();
    });
});

JSFiddle Demo:

Answer 1

attr从匹配的集合中获取第一个元素的属性。尝试这样的事情：

var $txt = $(".txt").hide();
$(".but > div").mouseenter(function() {
    $txt.hide().filter('.' + this.id).show();
})
.mouseleave(function () {
    $txt.hide();
});

演示：http://jsfiddle.net/74FYW/1/

Answer 2

你可以使用它，但这不是令人难以置信的方式

     $(".but > div").mouseenter(function() {
            var index=$('.but div').index(this);
            $('.txt:eq('+index+')').show();
        }).mouseleave(function () {
    $('.txt').hide();
});

Answer 3

谢谢你们，但我终于找到了我想要的东西。 解决方案就是将var行放在jquery函数中而不是它之前;

这就是我的意思：

$(".but > div").each(function(){
  var butInfo = $(this).attr("id"); 
  $(this)
    .mouseenter(function(){
      $(".txt").hide();
      $(".txt."+butInfo).show();
    })
    .mouseleave(function(){
      $(".txt."+butInfo).hide();
    });
});

JSFiddle Demo:

Answer 4

if (this.value > '0') {
var ya1 = $('#' + this.value + 'yap1').val();
$('#yap1').val(ya1);