Question

如果这是重复，我道歉。我正在努力寻找搜索术语，并没有找到有关如何解决我的问题的有用信息。我相信我过去已经解决了这个问题并且很常见。

我只想在项目中使用公共类名在特定div上应用事件和更改。问题是每当我选择并使用类调用其中一个div上的事件时，所有具有该类的div都会应用更改。

我认为添加特定的ID并使用ID选择器可以解决问题，但遗憾的是没有。

以下是我的一些示例代码：

HTML：

<div class="progress" id="encode">
    <div class="progress-bar six-sec-ease-in-out" id="encode_progress" role="progressbar" data-transitiongoal="100">

   </div>
</div>

JS：

$("#encode").fadeIn("fast");
$('#encode_progress').progressbar({
    display_text: 'center', 
    use_percentage: false, 
    refresh_speed: 10,
    done: function($this) { $this.html('TWEET ENCRYPTED'); 
    // $(".checkTweet").fadeIn("slow");
    $(".newTweet").fadeIn("slow");
    }
});

同样在同一次点击上运行的Secod Div：

HTML

<div class="progress" id="decode">
    <div class="progress-bar six-sec-ease-in-out" id="decode_progress" role="progressbar" data-transitiongoal="100">                
        </div>
</div>

JS：

$('#decodeSubmit').on("click", function(ev){
    ev.preventDefault();
    $("#decode_form").fadeOut("fast");
        $("#decode").fadeIn("fast");
        $('#decode_progress').progressbar({
            display_text: 'center', 
            use_percentage: false, 
            refresh_speed: 10,
            done: function($this) { $this.html('TWEET ENCRYPTED'); 
            // $(".checkTweet").fadeIn("slow");
            $(".newTweet").fadeIn("slow");
            }
        });

})

问题的根源在于这两个调用：

$("#decode_progress").progressbar();

$("#encode_progress").progressbar();

当我在控制台中运行它时，它返回相同的div（即使我有两个）。这个在被召唤时在两个不同的地方运行。我认为通过id选择只会运行与该id相关联的那个，但事实并非如此。

我对$（这个）知之甚少，但我有一种感觉，我必须使用它。再一次，我一直试图找到合适的搜索条件来推动我朝着正确的方向前进，但到目前为止我发现的一切并不是我想要的。

jquery类选择器将事件应用于具有类的所有元素

0 个答案: