jQuery - 动态选择器，不知道为什么它不触发

Question

下面是我触发滚动事件的静态示例。
它会警告“动态选择器”，这种情况下的警告结果是：（

#WordPanel #AZ-List div div div.ui-jqgrid-bdiv

没错，它与下面示例中键入的静态选择器相同）

$("#WordPanel #AZ-List div div div.ui-jqgrid-bdiv").scroll(function() {
    alert("#"+$(".left .active").val()+"Panel #"+$("#"+$(".left .active").val()+" div ul li.CmdActive").html()+" div div div.ui-jqgrid-bdiv");
});

我现在将获取alert()的内容；并将其用作动态选择器，但是当我滚动相同的滚动条时它不会触发。
（请注意，下面选择器的值与上面示例中使用的静态选择器的值完全相同。）

$("#"+$(".left .active").val()+"Panel #"+$("#"+$(".left .active").val()+" div ul li.CmdActive").html()+" div div div.ui-jqgrid-bdiv").scroll(function() {
    alert("Working");
});

..关于其工作方式的更多详细信息；
我并排有 2 个 div，有一个顶部导航栏+按钮控制左侧 div，这些按钮控制左侧 div 的内容。
默认情况下，第一个子菜单（由左侧的内容填充（由顶部导航栏））选项被选中。此子菜单选择控制右侧 div 的内容。（右侧内容通过 ajax 加载）

我使用 .html(data);将内容添加到右侧 div 中。内容中有 jquery 和 html 代码。

当正确的 div 内容加载时，上面的代码问题将在此时加载。
我需要与一个选择器匹配的示例（动态）

#WordPanel #JK-List div div div.ui-jqgrid-bdiv
#WordPanel #AZ-List div div div.ui-jqgrid-bdiv 
#AccountPanel #Password div div div.ui-jqgrid-bdiv 
#AccountPanel #UserName div div div.ui-jqgrid-bdiv

在这一阶段，问题是，它将选择默认情况下第一个结果，没有其他结果，在这种情况下它将匹配：

#WordPanel #JK-List div div div.ui-jqgrid-bdiv

也不匹配

#WordPanel #AZ-List div div div.ui-jqgrid-bdiv

并且即使我将 #AZ-List 作为匹配结果 （通过在 chrome 控制台中提醒选择器） 我很可能会采取解决这个问题的解决方案，将有一个隐藏的输入，该输入将保存子菜单文本（.html（））的值，并从那里开始。

Answer 1

我唯一能想到的是动态选择器内容受到实际滚动的影响。

尝试将选择器放入变量中并在使用它之前提醒它，以确保它是您想要的。

var selector = "#"+$(".left .active").val()+"Panel #"+$("#"+$(".left .active").val()+" div ul li.CmdActive").html()+" div div div.ui-jqgrid-bdiv";
alert(selector);
$(selector).scroll(function() {
    alert("Working");
});

上面是否提醒您想要的选择器？

Answer 2

我想知道是否有一些看不见的角色没有出现在警报中。

也许尝试修剪通过 .val() 和 .html() 获得的文本。

var val = $.trim( $(".left .active").val() );
var html = $.trim( $("#"+ val +" div ul li.CmdActive").html() );

console.log( val, html ); // check the console to verify the values

$("#"+ val +"Panel #"+ html +" div div div.ui-jqgrid-bdiv").scroll(function() {
    alert("Working");
});

我认为无论如何你都会想要缓存 $(".left .active") 因为你调用了它两次。

此外，在您的选择器中，您有一个元素 ID 是从另一个元素 ID 降序排列的。这应该是不必要的，因为 ID 无论如何都必须是唯一的。不需要指定您想要的祖先。

所以：

#WordPanel #AZ-List div div div.ui-jqgrid-bdiv

可能是：

#AZ-List div div div.ui-jqgrid-bdiv