jQuery点击在弹出窗口中不起作用

我有两个文件，它们在编码中是精确的，文件A和B.在文件A中有链接来创建文件B的弹出窗口。在文件A的顶部，I创建了一个链接（a href），单击它时会提醒用户。这确切的代码是在文件B.它可以在文件中的，而不是在文件B.jQuery点击在弹出窗口中不起作用

<a href="#" id="send-email">Send Email</a>

而jQuery的：

$('#send-email').click(function(e) { 
     alert('works'); 
    });

好奇的是，他们都链接到同一外部jQuery文件，以及其他可用的jQuery函数（例如，手风琴菜单），除了这个弹出式单击。我试着先使用jQueryUI，但这就是我发现这个问题的方法;然后我去了准系统点击提示，这就是我在上面发布的代码。

是否.click在弹出窗口中工作？如果是这样，怎么样？

来源

2012-08-22 Hybride

是的，它会弹出工作，在浏览器中打开它，并检查你正在尝试点击，找到该元素的确切ID是什么元素，浏览器可能已经改变了ID –

@ScottSelby，如果他的浏览器正在改变他的ID，我建议他发现自己是一个新的浏览器:) –

原来，这是一个问题在$（document）.ready（function （））。我认为弹出窗口不被视为“准备好”，这就是我遇到这个问题的原因。 – Hybride

弹出（除非你在某些浏览器中谈论会话状态和上下文，但这不是问题）。 click的功能与弹出窗口中的功能相同，即使在其他窗口中也是如此。虽然有很多事情可能会导致你的问题。重复的ID，缺少/拼写错误的功能等

所以我不能给你一个明确的答案，但这里有一个很好的一步进行调试：

，而不是一个click事件连接到它的方式，你正在做它（请注意，你的方法是不是我的方式更为正确的，但我在调试方式助剂），像这样做：

<a href="#" onclick = "alert('works')" id="send-email">Send Email</a>

如果不工作，也许你阻止弹出或什么的。这是警报的问题。如果它不工作，试试这个：

<a href="#" onclick = "AlertIt()" id="send-email">Send Email</a>

与此别处您的网页上：

function AlertIt() { 
alert("worked"); 
}

如果这个工程太，你很可能看着装载的jQuery或jQuery的冲突问题，更。

编辑：哦，还有一件事。尝试使用jQuery的live函数。这将事件处理程序附加到元素是否已存在。如果元素已经存在，click将只附加事件。这可能是由于您正在使用的操作顺序而导致的。

live看起来是这样的：

$("#send-email").live("click", function(){ alert("Worked"); });

来源

2012-08-22 17:30:31

所有这些选项都起作用，标记为正确。我对旧代码进行了测试，看起来问题在于代码位于$（document）.ready（function（））内。我会采取（不正确的）刺法，并说代码有效，但问题在于弹出不被视为“准备就绪”。一旦我将该代码移出该功能之外，它就完美地工作了。 – Hybride

@Hybride很好，实际上，这不是document.ready（）的工作原理。它的'document.ready（...）'部分就是所谓的事件。你在里面看到的'function（）{...}'部分被称为事件*处理器*。当文档的'ready'事件被触发时，该函数内的所有东西都会运行，当所有元素都被加载时会发生这种情况。简单地说，放入document.ready（）函数内的任何东西都会等待，直到所有元素都完成加载，然后自动执行。有趣的是，ready处理程序实际上可能是该代码的**最好的**位置。 –

@Hybride然后，我更新的猜测是，您在就绪处理程序的上下文中存在jQuery冲突。或者它可能是因为你的准备处理程序附近有一个语法错误，并且它不被解析为一个函数，所以它不会被调用。不过，无论如何，你的document.ready中正在发生一些奇怪的事情 –

你对弹出窗口有什么意思？你的意思是jQueryUI对话框？如果加载JavaScript代码时存在标记吗？

，你可以，如果你正在使用jQuery使用.on 1.7+，只是做所有#send-email要么是在网页加载时，或者你用AJAX加载在dyanmic委托：

$(function() { 
    $(document).on("click", "#send-email", function(e) { 
     alert('works'); 
     e.preventDefault(); 
    }); 
});

来源

2012-08-22 17:23:52 voigtan

同意@voigtan。为动态内容分配事件处理程序可能会很棘手。

在事件处理程序未绑定到弹出窗口中的内容的情况下，以及在文档就绪处理程序中绑定事件的情况下。有两种方法，你可以照顾的是：

有显示的弹出内容后回调，并绑定事件新的元素

如果元素有一个统一的事件处理程序，为它们分配一个类可以用作选择器并通过jQuery :: live（）调用附加事件。这里有一个例子：

<a href="#" class="send-email">Send Email</a> 

$(function() { 
    $(document).on("click", "a.send-email", function(e) { 
     alert('works'); 
     e.preventDefault(); 
    }); 
});

来源

2012-08-22 17:43:41 Rohit

jQuery点击在弹出窗口中不起作用

回答

相关问题