0

我有一个外部 javascript 文件，可以在我的 html 页面上的 div 中加载 HTML：

$(window).load(function(){
$('img#madhere').click(function(e) {
    e.preventDefault();
  $('#extras').html('<ul class="animated flash"><li class="drop"><a id="infobutton" class="scroll" href="#bottomcontent"></a><div class="dropdownContain"><div class="dropOut"><ul><li><a id="show_madhere_info" href="">Info</a></li><li><a id="show_madhere_credits" href="">Credits</a></li><li><a id="show_madhere_trivia" href="">Trivia</a></li><li><a class="twits" href="https://twitter.com/share?text=Check%20out%20%22Were%20All%20Mad%20Here%22%20on%20Jick%20Pictures&url=http%3A%2F%2Fwww.jickpictures.com" target="_blank">Twitter</a></li><li><a class="facebooker" href="https://www.facebook.com/dialog/feed?app_id=19884028963&ref=share_popup&link=http%3A%2F%2Fvimeo.com%2F58261368&redirect_uri=http%3A%2F%2Fvimeo.com%2F58261368%3Fclose" target="_blank">Facebook</a></li><li><a class="tuber" href="http://youtu.be/TFht5BGvoLU" target="_blank">YouTube</a></li><li><a class="vimeos" href="https://vimeo.com/58261368" target="_blank">Vimeo</a></li><li><a class="reddits" href="http://www.reddit.com/submit" onclick="window.location = "http://www.reddit.com/submit?url=" + encodeURIComponent(window.location); return false" target="_blank">Reddit</a></li></ul></div></div></li></ul>');  
  });
});

除了我的链接正常工作外，它加载得很好。单击链接时，这些链接还需要另一个具有新功能的外部 javascript 文件。

$(document).ready(function(){
        $("#show_madhere_info").click(function() {
            $("div#modal").addClass("show");

我的问题是用于显示“show_madhere_info”div 的 jquery 函数不起作用。相反，它会恢复为“href”链接，它只会使页面重新加载。

<a id="show_madhere_info" href="">Info</a>

就像它无法从另一个 jquery 函数中的我的 HTML 中识别 div。那有意义吗？在从之前的 jQuery 函数加载内容后，我可以在此处做什么以使链接正常工作？

4

3 回答 3

0

In html you can use:

<a id="show_madhere_info" href="javascript:void(0);">Info</a>

In the code you can try:

$(document).on("click", "#show_madhere_info", function(e) {
  //e.preventDefault();
  //do what you want
}
于 2013-04-05T03:57:19.963 回答
0

如果您使用 jquery >= 1.7，请使用事件委托来动态添加内容

$('#extras').on('click', '#show_madhere_info', function(e){
    $("div#modal").addClass("show");
    e.preventDefault()
});
于 2013-04-05T03:14:35.253 回答
0

动态插入的元素需要使用 .on() 函数，并且不能使用标准的 .click() 方法。

尝试使用这个：

$(document).on('click', $("#show_madhere_info"), function(e) {

  e.preventDefault(); //stop the usual href action      
  ...

}

还要确保您使用最新版本的 jQuery 1.9.x

于 2013-04-05T03:00:33.517 回答