HTML5   发布时间:2022-04-27  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了之前使用javascript替换之前的iphone / ipad“鼠标悬停”在新链接上大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
单击 iphone或ipad上的链接后,它会留下模拟鼠标悬停,触发该链接上的a:hover css样式.如果链接具有使您保持在同一页面javascript处理程序,则在您单击其他链接之前,悬停状态不会更改.

如果您有一个ajax小部件询问问题并且每个答案都是链接,这会很奇怪.当你触摸其中一个答案时,它突出显示悬停状态,然后当问题和答案被新问题和答案替换(使用javascript)时,出现在与先前答案相同位置的新答案有其悬停状态自动触发.我想阻止这种情况发生在新的答案链接上.

是否有任何方式(也许是javascript中的某些东西)可以给我与“悬停”不再高于此元素相同的结果?

笔记:

>我知道我可以有一个:悬停使用相同的CSS样式作为a,但是a:主动样式几乎不会引人注意,因为触摸点击的活动状态是如此简短,所以我希望能够显示悬停的东西链接上的状态,直到我用新的HTML替换它
>我在javascript中尝试了各种方法,比如在dom元素和其他一些东西上调用“blur()”,但没有运气 – 我开始认为最好的解决方案是将类应用到javascript上的链接我自己管理悬停状态的事件(或者只是保持原样)

解决方法

问题在于,当您替换现有内容时,Mobile Safari会将新元素视为旧元素,因为它们在DOM中占据相同的位置.一种解决方法是首先删除旧元素,然后异步添加新元素.最简单的方法是使用setTimeout().

http://jsfiddle.net/chad/JNZvu/10/

// When we click on an answer
$('body').on('click','.answer',function(){
  // don't follow it's link
  event.preventDefault();
   // fade out the container
  $('.container').fadeOut(function(){
    // remove old elements (happens after fadeOut because we are in the callBACk)
    $('.container').html('');
    // add new elements asynchronously and fade container BACk in.
    setTimeout( '$(\'.container\').html(\'<a class="answer" href="#c">link 3</a><a class="answer" href="#d">link 4</a>\');$(\'.container\').fadeIn();',0);
  });
});

当真实地执行此操作时,将在与AJAX函数同时调用fadeOut,然后在AJAX回调中执行删除/添加.

大佬总结

以上是大佬教程为你收集整理的之前使用javascript替换之前的iphone / ipad“鼠标悬停”在新链接上全部内容,希望文章能够帮你解决之前使用javascript替换之前的iphone / ipad“鼠标悬停”在新链接上所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。