jQuery .on()在加载不同内容后无法工作
如果您转到http://www.elemovements.com并尝试单击第一篇文章中的“阅读更多......”,它将与单击存档中的同一链接一起工作。这一切都由这个代码块来处理......这很麻烦,是的,但我一直在努力想办法做到这一点。jQuery .on()在加载不同内容后无法工作
(function() {
var $Body = $("#news .inner");
var $Title = $("#news .title");
var strNewsURL = "<?=URL_NEWS?>";
$(document).on("click", "a:contains(Read More...)", function(event) {
var strOld = $Body.html();
var strURL = $(this).attr("href").replace("index.php", strNewsURL);
//var strBackURL = strURL.match(/archive.php/) ? "archive.php?xnewsaction=getnews&newsarch=" + getURLVars(strURL)['newsarch'] : strNewsURL;
$Body.slideUp(100);
$.get(
strURL,
objNHF,
function(strData) {
$Body.html(strData + '<a class="back"><?=TEXT_BACK?></a>').slideDown(1000, "easeOutBounce");
$(document).on("click", "#news a.back", function(event) {
$Body.slideUp(100, function() {
$(this).html(strOld);
}).slideDown(1000, "easeOutBounce");;
event.preventDefault();
});
}
);
track(strURL);
event.preventDefault();
});
})();
如果尝试加载其他页面(比方说,“联系方式”),然后点击“首页”再次触发该事件,但没有内容加载到股利。我在这里做错了什么?非常令人费解。
这些变量的on/live
点击之外声明。加载新内容时,这些元素将被替换,并且变量指向旧副本。
var $Body = $("#news .inner");
var $Title = $("#news .title");
移动点击所以他们每次刷新里面这些变量:
$(document).on("click", "a:contains(Read More...)", function(event) {
var $Body = $("#news .inner");
var $Title = $("#news .title");
...
我不认为你可以使用伪选择器的委托事件处理程序。为了解决这个问题只需要使用HTML结构链接周围,你的优势:
$(document).on('click', '.more a', function() {...});
这是一个好主意,反正因为:contains
伪选择是相当缓慢。 a:contains(Read More...)
必须遍历页面上的每个链接,并获取它的文本进行检查。
什么是令人费解的是它在第一次运行正常,但如果我改变同一div的内容,其中#news DIV是,然后重新加载#news div,它不会工作。 – 2012-01-30 23:22:44
我只是尝试在该类名称的链接上添加一个范围,附加事件,但仍然遇到同样的问题。虽然我同意这种方法更合乎逻辑,但是我插入了一个新闻系统,并且我不想通过数千行代码修改其HTML。无论如何,这只是一个原型,因为它是此网站上此类链接的第一个实例。 – 2012-01-30 23:27:58
如果他/她使用'on()',那么他/她使用的是jQuery 1.7+,其中'live()'的版本已被弃用(推荐使用'on()')。在版本1.7之前''delegate()'是首选的。 – 2012-01-31 00:39:49
好点。但on()没有按预期工作,而live()会。 – Fresheyeball 2012-01-31 00:41:39
我试过live(),但似乎失败了。它看起来好像on()取代了live()?这里是一个jsFiddle来演示相同的想法:http://jsfiddle.net/grn2012/qRWa5/20/ – 2012-01-31 00:43:12
**我只是试图在同一时间发布!**哈哈。不幸的是,我的名声不允许我回答我自己的问题,所以,为你而忙。不管怎么说,还是要谢谢你。 – 2012-01-31 02:25:26
但是,我也遇到了一个新问题(唉)。不是用户会这样做,但如果您多次点击“阅读更多...”,并在第二次或更高的运行时点击“ 2012-01-31 02:30:22
啊,这是因为'a.back'处理程序应该是一个简单的'click()',而不是'on()'。感谢大家。 – 2012-01-31 02:44:35