jQuery的AJAX标签使用的preventDefault（）与（）

我有一组被点击时，他们是加载个人.PHP页面jQuery UI的AJAX标签。我的所有样式等都表达了这一点，因为包含标签小部件的页面提供了已链接的CSS和脚本。但是，当点击选项卡时加载的实际页面时，我看不到让preventDefault（）在这些新创建的DOM元素上使用.on（）。我使用jQuery烧烤用我的标签，所以我不能有jQuery的AJAX标签使用的preventDefault（）与（）

“＃” S被添加到URL。这是在点击标签面板中的链接时引起的。我已经能够成功地在最初加载的DOM元素上使用preventDefault（），但不能通过AJAX将其提取到标签小部件中。

我对内容toggler功...

$(function(){ 
$(".showMoreOrLess").on('click', (function() { 
if (this.className.indexOf('clicked') != -1) { 
    $(this).removeClass('clicked'); 
    $(this).prev().slideUp(500); 
    $(this).html("Read More" + "<span class='moreUiIcon'></span>"); 
    } 
    else { 
    $(this).addClass('clicked'); 
    $(this).prev().slideDown(500); 
    $(this).html("See Less" + "<span class='lessUiIcon'></span>"); 
    }  
})); 
});

我想给的preventDefault（）这个函数结合进去。

// prevents default link behavior on BBQ history stated tab panels with "showMoreOrLess" links 
$(".showMoreOrLess").click(function (event) 
{ 
event.preventDefault(); 
//here you can also do all sort of things 
}); 
// /prevents default behavior on "showMoreOrLess" links

我使用。对（“点击”，功能（工作）），等等我用。对（）在一个单独的功能，尝试了几种方式，并试图将其在第一组合功能如上。有谁知道我做错了什么？该代码适用于静态的标签内容，而不是通过AJAX加载的内容。任何帮助将不胜感激。似乎无法弄清楚这一点。提前致谢。

来源

2012-04-23 Dick Kirkland

$("body").on('click', ".showMoreOrLess", function(event) { 
    event.preventDefault(); 
    var self = $(this); 
    if (self.hasClass('clicked')) { 
    self.html("Read More" + "<span class='moreUiIcon'></span>").removeClass('clicked').prev().slideUp(500); 
    }else { 
    self.html("See Less" + "<span class='lessUiIcon'></span>").addClass('clicked').prev().slideDown(500); 
    } 
});

来源

2012-04-23 19:30:03 Relic

文物！非常感谢！您不仅可以使用.on（）方法解决preventDefault问题，而且还可以使用更少的内联函数$（this）优雅地整合函数中的代码。我非常感谢您的帮助和时间。起初代码不起作用，因为我认为我有原始函数的残余，但是单独使用你自己的工作对静态和AJAX加载的UI标签面板内容。你摇滚！ – 2012-04-25 17:36:04

我很高兴能有这样的帮助！ '-Cheers' – Relic 2012-04-25 22:51:42

部分$(".showMoreOrLess").click只适用于您的网页上已经accessable链接

尝试使用事件代理（这里的点击次数的每次现有元素上捕获的，你只要把它传递是留意选择...作为一个好的副作用保存听众

$(document).on("click", ".showMoreOrLess", function(event) { 
    event.preventDefault(); 
    //here you can also do all sort of things 
});

而非文档使用某个ID从$("#myContainerId")页（编辑：当然你点击需要的元素是元素的内部与ID）

来源

2012-04-23 19:22:25

非常感谢。这在使用“body”作为选择器时有效。我已经选择使用下面的Relic的建议，因为我已经使用了$（this）的更少的用途来合并函数。我试图将你的标记作为答案，但我想SO只允许每个线程为我。我感谢你的时间。 – 2012-04-25 17:33:43

这不是要获得声望，而是互相帮助:) – 2012-04-25 17:48:20

你打赌！感谢您的理解。 – 2012-04-25 19:17:27

jQuery的AJAX标签使用的preventDefault（）与（）

回答

相关问题