SharePoint Web部件上的jQuery.hover無法正常工作

Question

我正在駕駛脫離SharePoint列表的導航欄上工作。除我的.hover事件外，所有事情都按預期工作。

編輯：我改變了我的代碼行這樣：

$('table').hover(function() { alert(this.id); }); 

我注意到，每當我盤旋在我的標題標籤，警告信息是空白。這讓我相信，它甚至不會返回ID。然而，ID獲取返回父元素（<table>）.....我一定在做一些愚蠢的事情。

當我有這個，它的工作原理：

$(document).hover(function() { alert(); }); 

然而，當我有這個，什麼都不會發生：

$("#Header0").hover(function() { alert(); }); 

任何想法是，爲什麼這不會在SharePoint，但工程工作如果我只是做一個普通的Web應用程序？

這裏是我的所有代碼：

/////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////// 
////////////////////////////////////////EVERYTHING BELOW THIS LINE IS GOOD TO GO///////////////////////////////////////////////////// 
/////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////// 
//Print Headers to Screen. This will drive the core functionalty of the navpart 
var siteUrl = '/sites/dev'; 
ExecuteOrDelayUntilScriptLoaded(retrieveListItems, "sp.js"); 
theCounter = 0; 
var Headers = new Array(); 
var getCurrentElementId = null; 
function retrieveListItems() { 
var clientContext = new SP.ClientContext(siteUrl); 
var oList = clientContext.get_web().get_lists().getByTitle('myList'); 
var camlQuery = new SP.CamlQuery(); 
camlQuery.set_viewXml("<Where><IsNotNull><FieldRef Name='Title' /></IsNotNull></Where>"); 
this.collListItem = oList.getItems(camlQuery); 
clientContext.load(collListItem); 
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed)); 
} 
function onQuerySucceeded(sender, args) { 
var listItemInfo = ''; 
var listItemEnumerator = collListItem.getEnumerator(); 
while (listItemEnumerator.moveNext()) { 
    var oListItem = listItemEnumerator.get_current(); 
    theCounter += 1; 
    Headers[theCounter - 1] = oListItem.get_item('Title'); 
} 
var HeaderDisplay = _.uniq(Headers); 
for (var i = 0; i <= HeaderDisplay.length - 1; i++) { 
    $('#TableElement').append("<th id=Header" + i + ">" + HeaderDisplay[i] + "::::::" + "</th>"); 
} 
} 
function onQueryFailed(sender, args) { 
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace()); 
} 

    /////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////// 
////////////////////////////////////////EVERYTHING ABOVE THIS LINE IS GOOD TO  GO///////////////////////////////////////////////////// 
    /////////////////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////// 


// You got the headers to print as expected. Right now you need to figure out how to get the current ID 
// that the mouse is over. Try looking at another project you did where the mouse goes into the table header 
// and the outline expands. 


$("#Header0").hover(function() { alert(); }); 



//This should be the universal onmouseover event that will expose only links 
//and values relavent to the selected header. 

//$(document).ready(function onPageLoad() { 
// $().SPServices({ 
//  operation: "GetListItems", 
//  async: false, 
//  listName: "myList", 
//  CAMLQuery: "<Query><Where><IsNotNull><FieldRef Name='Title' /></IsNotNull></Where></Query>", 
//  completefunc: function completeFunction(xData, Status) { 
//   $(xData.responseXML).SPFilterNode("z:row").each(function() { 
//    var Headers = "<th>" + $(this).attr("ows_Title") + "</th>"; 
//    $("#TableElement").append(Headers); 
//   }); 
//  } 
// }); 
//}); 

Answer 1

試着做這樣的事情...

$('#TableElement').hover(function() { 
$('#Header0').hover(function() { 
    $('#Header2').append("<li>" + this.id + "</li>"); 
}); 
}); 

我懷疑這是行不通的，因爲jQuery的不能 '查找' 的ID。一旦進入父母，它應該選擇它。