javascript - 检测对带有扩展 javascript 的动态下拉框的点击

Question

我正在尝试检测对 Javascript 中列表元素的点击 - 但有一个转折点。列表元素位于 Quora 搜索栏的下拉列表中。 www.quora.com - 具体来说，我想检测用户何时单击添加问题按钮并弹出弹出框。

弹出框由一些额外的 div 组成，这些 div 要么是隐藏的，要么是动态生成的。列表的 html 看起来像

<li class="addquestionitem" id="__w2_FWrLuSU_list_item_11">

当我将鼠标悬停在该特定列表元素上时，它会变为

<li class="addquestionitem selected" id="__w2_FWrLuSU_list_item_11">

现在，我的代码如下所示:

$("li[class='addquestionitem selected']").click(function() {
    $(document).ready(function(){
        alert('this link has been clicked');
        $("div[id$=_publish_checkboxes]").append(element);
    }

但即使是警报也没有出现。有什么建议吗？

更新下面发布的解决方案似乎都不起作用。我还使用 quora 主页上的创建板按钮进行了测试，单击该按钮会产生类似的嵌入 css 的弹出窗口。它在那里工作。具体来说，我使用的选择器是:

$("a[class='add_content_link action_button icon_action_button']")

真的不明白为什么在添加问题按钮的类似情况下它不起作用

更新 2这是 list 文件。 :

{
    "name": "A browser action with a popup that changes the page color.",
    "version": "1.0",
    "manifest_version": 2,
    "browser_action": {
        "default_title": "Set this page's color.",
        "default_icon": "icon.png"
    },
    "permissions": [
        "tabs", "http://www.quora.com/*"
    ],
    "background": {
        "page": "popup.html"
    },
    "content_scripts":[
        {
            "matches": ["http://www.quora.com/*"],
            "js": ["jquery.js", "read_in_array.js", "add.js", "popup.js"]
        }
    ]
}

Answer 1

Any suggestions?

您需要将 $.ready 函数包裹在其他所有内容中。此外，由于下拉菜单可能是动态构建的，我建议使用 delegated events .接下来，您的类选择器看起来很奇怪，我认为您也可以简单地省略 selected 类。

$(document).ready(function(){
    $(document).on("click", "li.addquestionitem", function() {
        alert('this link has been clicked');
        $("div[id$=_publish_checkboxes]").append(element);
    });
});