jQuery函数在JavaScript for循环中不起作用.请帮助

jQuery function doesn't work in a JavaScript for-loop. Please Help

本文关键字：不起作用 帮助 循环 for 函数 JavaScript jQuery      更新时间：2023-09-26

我以前贴过这个问题的变体，就像我想我已经得到它一样，它不工作了。

虽然我想出了这个问题，但是没有答案。当我执行这段代码时，它工作得很好: 
var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
    for (i=0;i<=5;i++) {
        for (j=0;j<3;j++) { 
            var $eqn = "ul.side-block-content li:eq("+i+") .article-title a span";  
        }
        $($eqn).replaceWith($titleMarquee+$(this).text()+"</marquee>");
    }

但是一旦我放入一个事件，比如。mouseenter，它就会出错并停止工作:

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
    for (j=0;j<3;j++) { 
        var $eqn = "ul.side-block-content li:eq("+i+") .article-title a span";  
    }
    $($eqn).mouseenter(function(){
        $($eqn).replaceWith($titleMarquee+$(this).text()+"</marquee>");
    }); 
}

还有什么奇怪的是，我已经弄清楚的是问题的一部分是当两个。event和。replacewith有一个变量。如果我只是给。mouseenter分配一个变量，并为。replacewith使用$(this)，它工作得很好，但限制了我想做的事情。我甚至不能使用("+ I +")

这是我想用脚本实现的，它不这样工作。请帮助。

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
    for (j=0;j<3;j++) { 
        $("ul.side-block-content li:eq("+i+")").mouseenter(function(){
            $("ul.side-block-content li:eq("+i+") .article-title a span").replaceWith($titleMarquee+$(this).text()+"</marquee>");
        });   
    }
}

不如这样:

$("ul.side-block-content li").mouseenter(function() {
    var $this = $(this);
    var $titleMarquee =
        $('<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"></marquee>');
    $(".article-title a span", $this)
        .replaceWith($titleMarquee.text($this.text()));
});

下面是一个工作示例:http://jsfiddle.net/mXtmB/

如果您想限制li元素，以便将事件应用于前6个元素:

for (var i = 0; i <= 5; i++) {
    $("ul.side-block-content li:eq(" + i + ")").mouseenter(function() {
        var $this = $(this);
        var $titleMarquee =
        $('<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"></marquee>');
        $(".article-title a span", $this)
            .replaceWith($titleMarquee.text($this.text()));
    });
}

我现在很难测试它，检查它是否有效。

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
var i, j; // important
for (i=0;i<=5;i++) {
    (function (i) {
        $("ul.side-block-content li:eq("+i+")").mouseenter(function(){
            $("ul.side-block-content li:eq("+i+") .article-title a span").replaceWith($titleMarquee+$(this).text()+"</marquee>");
        });   
    }(i));
}

我还删除了那个无意义的循环

当您使用$eqn变量访问元素时，您将访问最后一个元素，因为该变量的值在您连接事件之后发生了变化。使用this关键字访问事件连接到的元素:

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1">';
for (i=0;i<=5;i++) {
  $("ul.side-block-content li:eq("+i+") .article-title a span").mouseenter(function(){
    $(this).replaceWith($titleMarquee+$(this).text()+"</marquee>");
  });
}
相关文章：