Question

以下是我的<head> + <body>部分：

<script type="text/javascript" src="http://www.septa.org/site/js/jquery-1.4.2.js">
<script type="text/javascript">
function insert(){
var linkElement = document.getElementById("BackButton");
var linkElementLnk = document.getElementById("BackButtonlnk");
var loc_array = document.location.href.split('/');

if (loc_array[loc_array.length-3] == "m")
{
  linkElementLnk.style.display = 'none';
}
if (loc_array[loc_array.length-3] == "maps" || loc_array[loc_array.length-2] == "stations" || loc_array[loc_array.length-3] == "stations" )
{
  linkElementLnk.style.display = 'block';
  var newT = document.createTextNode("Stations & Maps");
}
if (loc_array[loc_array.length-2] == "w" || loc_array[loc_array.length-2] == "s" || loc_array[loc_array.length-2] == "h" )
{
  linkElementLnk.style.display = 'block';
  var newT = document.createTextNode(unescape(capWords(loc_array[loc_array.length-2])));
}
else if (loc_array[loc_array.length-3] != "m")
{
  linkElementLnk.style.display = 'block';
  if (loc_array[loc_array.length-1] == "index.html" || loc_array[loc_array.length-1] == "index.shtml" || loc_array[loc_array.length-1] == "")
  {
  var newT = document.createTextNode(unescape(capWords(loc_array[loc_array.length-3])));
  }
  else
  {
  var newT = document.createTextNode(unescape(capWords(loc_array[loc_array.length-2])));
  }
}
linkElement.appendChild(newT);
}
function capWords(str){ 
   var words = str.split(" "); 
   for (var i=0 ; i < words.length ; i++){ 
      var testwd = words[i]; 
      var firLet = testwd.substr(0,1); 
      var rest = testwd.substr(1, testwd.length -1) 
      words[i] = firLet.toUpperCase() + rest 
   }
   return words;
} 
</script>
<script type="text/javascript" src="http://www.septa.org/site/js/qTip.js"></script>
<style>
div#qTip {
  padding: 3px;
  border: 1px solid #666;
  border-right-width: 2px;
  border-bottom-width: 2px;
  display: none;
  background: #1c1c1c;
  color: #FFF;
  font: bold 9px Verdana, Arial, Helvetica, sans-serif;
  text-align: left;
  position: absolute;
  z-index: 1000;
}
</style>
</head>
<body onload="insert();">

当我onload="insert();"中有<body>时，它会使jQuery工具提示无法运行。有人知道解决这个问题吗？

Answer 1

我查看了代码：http://www.septa.org/site/js/qTip.js 你在上面包括的那个。

猜猜我发现了什么？累积奖金！

window.onload = function () {
    tooltip.init ();
}

因此，当您将自己的函数添加到body标记时，它会覆盖工具提示函数。

Answer 2

尝试删除onload =“insert（）;”并使用jquery ready。

$(document).read(function() {
  insert();
});

当你使用jquery insted时

var linkElement = document.getElementById("BackButton");

使用

var linkElement = $('#BackButton');

insted的

inkElementLnk.style.display = 'block';

使用jquery

inkElementLnk.css('display', 'block');

Answer 3

也许某种竞争条件正在发生？如果没有看到所有代码，很难说，但是为什么不在文档准备好的时候insert()，因为你已经使用了jQuery？

$(function () {
    insert();
});

根据this answer，您可以通过执行类似

的操作来避免这种情况

var oldLoad = window.onLoad || function(){};
window.onLoad = function() {    
    // new functionality

    oldLoad();
};

Answer 4

尝试在致电inside之前添加延迟。在下面的代码中，它将在半秒后被调用：

$(document).ready(function() {
    setTimeout(insert, 500);
});

这将确保在您自己的代码之前将工具提示初始化函数称为。

JavaScript干扰

4 个答案: