0
我無法讓我的jQuery代碼在SharePoint中運行。事實上,它不是一個問題。我的一些頁面需要jQuery來渲染頁面元素,特別是在定位和可見性方面。當我在開發環境中創建頁面時,一切都很順利。我所做的是將jQuery代碼放置在隱藏的內容編輯器Web部件中。未在頁面加載SharePoint中運行的jQuery代碼
<script lang="en" type="text/jscript">
function toggleContent(content)
{
var i;
var x = "";
for(i=1; i<=13; i++)
{
x = "#C"+i;
$(x).css("visibility","hidden");
}
$(content).css("visibility","visible");
}
function toggleGblContent()
{
var i;
var x = "";
for(i=1; i<=13; i++)
{
x = "#gblD"+i;
$(x).css("visibility","hidden");
}
}
function toggleImgMenu(menu,bol) // menu represents the selected tab, bol determines whether the 5th menu
{ // will be inactive (0) or active (1)
var i;
var x = "";
for(i=1; i<=5; i++)
{
x = "#menu"+i;
$(x).attr("class","activelayer");
}
$(menu).attr("class","selectedlayer");
if (menu != "#menu5")
{
if (bol==0) // meaning outer tab is First Day or First Month
{
$("#menu5").attr("class","inactivelayer");
}
else
{
$("#menu5").attr("class","activelayer");
}
}
}
function posGblContent(content,src)
{
//var pos = $(content).height() - 10;
var pos = $(content).height();
/*
if (content == "#C1")
{
//alert(pos);
//I know this code is kind of stupid, but SP keeps changing the height of DIV C1 in display mode
//screwing up the look in the process. Other similar DIVs work fine.
if (pos == "247")
{
$("#globalContent").css({"position":"absolute","top":"233px", "left":"0px"});
}
else
{
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
}
//alert($("#globalContent").css("top"));
}
else
{
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
}
*/
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
//alert(src);
toggleGblContent();
//$("#gblIfrContent").attr("src","/systems_hr/onboarding/Custom%20Pages/Checklist%20EN/" + src + ".html");
$(src).css("visibility","visible");
}
function innerTabState(state)
{
switch(state)
{
case "day":
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C1");
// change state of outer tabs
$("#day1").attr("class","current");
$("#week1").attr("class","active");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").html("Payroll, Benefits,<br>& Personal Information");
$("#tabitem1").attr("class","leftmostvlin");
$("#tabitem2").text("Business Overview");
$("#tabitem2").attr("class","tablink");
$("#tabitem3").text("Office Resources");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").text("Online Assignments");
$("#tabitem4").attr("class","tablink");
$("#tabitem5").text("");
// change global content
posGblContent("#C1","#gblD1");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C1");
posGblContent("#C1","#gblD1");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C2");
posGblContent("#C2","#gblD2");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C3");
posGblContent("#C3","#gblD3");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C4");
posGblContent("#C4","#gblD4");
});
break;
case "week":
// change state of inner tabs
toggleImgMenu("#menu1",1);
// change visibility of RADEditors
toggleContent("#C5");
// change state of outer tabs
$("#day1").attr("class","active");
$("#week1").attr("class","current");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").text("Introductions");
$("#tabitem1").attr("class","leftmost");
$("#tabitem2").text("Position Information");
$("#tabitem2").attr("class","tablink");
$("#tabitem3").text("Personal Safety");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").text("Additional Resources");
$("#tabitem4").attr("class","tablink");
$("#tabitem5").text("E-Learning");
$("#tabitem5").attr("class","tablink");
// change global content
posGblContent("#C5","#gblD5");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",1);
toggleContent("#C5");
posGblContent("#C5","#gblD5");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",1);
toggleContent("#C6");
posGblContent("#C6","#gblD6");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",1);
toggleContent("#C7");
posGblContent("#C7","#gblD7");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",1);
toggleContent("#C8");
posGblContent("#C8","#gblD8");
});
$("#tabitem5").click(function()
{
toggleImgMenu("#menu5",1);
toggleContent("#C9");
posGblContent("#C9","#gblD9");
});
break;
case "month":
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C10");
// change state of outer tabs
$("#day1").attr("class","active");
$("#week1").attr("class","active");
$("#month1").attr("class","current");
// change texts of menus
$("#tabitem1").text("Policies & Procedures");
$("#tabitem1").attr("class","leftmost");
$("#tabitem2").html("Travel & Expense <br>Policies & Procedures");
$("#tabitem2").attr("class","vlin");
$("#tabitem3").text("Training & Development");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").html("Employee<br>Communications");
$("#tabitem4").attr("class","vlin");
$("#tabitem5").text("");
// change global content
posGblContent("#C10","#gblD10");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C10");
posGblContent("#C10","#gblD10");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C11");
posGblContent("#C11","#gblD11");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C12");
posGblContent("#C12","#gblD12");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C13");
posGblContent("#C13","#gblD3");
});
break;
}
}
$(document).ready(function()
{
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C1");
// change state of outer tabs
$("#day1").attr("class","current");
$("#week1").attr("class","active");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").html("Payroll, Benefits,<br>& Personal Information");
$("#tabitem2").text("Business Overview");
$("#tabitem3").text("Office Resources");
$("#tabitem4").text("Online Assignments");
$("#tabitem5").text("");
//change positions of global content
posGblContent("#C1","#gblD1");
//$("#globalContent").css({"position":"absolute","top": $("#C1").height() - 3 + "px", "left":"0px"});
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C1");
posGblContent("#C1","#gblD1");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C2");
posGblContent("#C2","#gblD2");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C3");
posGblContent("#C3","#gblD3");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C4");
posGblContent("#C4","#gblD4");
});
});
</script>
然而,當我在生產環境中複製它,代碼將不會運行的onload,儘管具有相同的密碼和設置:(
這裏的生產代碼:
<script lang="en" type="text/jscript">
function toggleContent(content)
{
var i;
var x = "";
for(i=1; i<=13; i++)
{
x = "#C"+i;
$(x).css("visibility","hidden");
}
$(content).css("visibility","visible");
}
function toggleGblContent()
{
var i;
var x = "";
for(i=1; i<=13; i++)
{
x = "#gblD"+i;
$(x).css("visibility","hidden");
}
}
function toggleImgMenu(menu,bol) // menu represents the selected tab, bol determines whether the 5th menu
{ // will be inactive (0) or active (1)
var i;
var x = "";
for(i=1; i<=5; i++)
{
x = "#menu"+i;
$(x).attr("class","activelayer");
}
$(menu).attr("class","selectedlayer");
if (menu != "#menu5")
{
if (bol==0) // meaning outer tab is First Day or First Month
{
$("#menu5").attr("class","inactivelayer");
}
else
{
$("#menu5").attr("class","activelayer");
}
}
}
function posGblContent(content,src)
{
//var pos = $(content).height() - 10;
var pos = $(content).height();
/*
if (content == "#C1")
{
//alert(pos);
//I know this code is kind of stupid, but SP keeps changing the height of DIV C1 in display mode
//screwing up the look in the process. Other similar DIVs work fine.
if (pos == "247")
{
$("#globalContent").css({"position":"absolute","top":"233px", "left":"0px"});
}
else
{
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
}
//alert($("#globalContent").css("top"));
}
else
{
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
}
*/
$("#globalContent").css({"position":"absolute","top": pos + "px", "left":"0px"});
//alert(src);
toggleGblContent();
//$("#gblIfrContent").attr("src","/systems_hr/onboarding/Custom%20Pages/Checklist%20EN/" + src + ".html");
$(src).css("visibility","visible");
}
function innerTabState(state)
{
switch(state)
{
case "day":
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C1");
// change state of outer tabs
$("#day1").attr("class","current");
$("#week1").attr("class","active");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").html("Payroll, Benefits,<br>& Personal Information");
$("#tabitem1").attr("class","leftmostvlin");
$("#tabitem2").text("Business Overview");
$("#tabitem2").attr("class","tablink");
$("#tabitem3").text("Office Resources");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").text("Online Assignments");
$("#tabitem4").attr("class","tablink");
$("#tabitem5").text("");
// change global content
posGblContent("#C1","#gblD1");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C1");
posGblContent("#C1","#gblD1");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C2");
posGblContent("#C2","#gblD2");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C3");
posGblContent("#C3","#gblD3");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C4");
posGblContent("#C4","#gblD4");
});
break;
case "week":
// change state of inner tabs
toggleImgMenu("#menu1",1);
// change visibility of RADEditors
toggleContent("#C5");
// change state of outer tabs
$("#day1").attr("class","active");
$("#week1").attr("class","current");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").text("Introductions");
$("#tabitem1").attr("class","leftmost");
$("#tabitem2").text("Position Information");
$("#tabitem2").attr("class","tablink");
$("#tabitem3").text("Personal Safety");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").text("Additional Resources");
$("#tabitem4").attr("class","tablink");
$("#tabitem5").text("E-Learning");
$("#tabitem5").attr("class","tablink");
// change global content
posGblContent("#C5","#gblD5");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",1);
toggleContent("#C5");
posGblContent("#C5","#gblD5");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",1);
toggleContent("#C6");
posGblContent("#C6","#gblD6");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",1);
toggleContent("#C7");
posGblContent("#C7","#gblD7");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",1);
toggleContent("#C8");
posGblContent("#C8","#gblD8");
});
$("#tabitem5").click(function()
{
toggleImgMenu("#menu5",1);
toggleContent("#C9");
posGblContent("#C9","#gblD9");
});
break;
case "month":
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C10");
// change state of outer tabs
$("#day1").attr("class","active");
$("#week1").attr("class","active");
$("#month1").attr("class","current");
// change texts of menus
$("#tabitem1").text("Policies & Procedures");
$("#tabitem1").attr("class","leftmost");
$("#tabitem2").html("Travel & Expense <br>Policies & Procedures");
$("#tabitem2").attr("class","vlin");
$("#tabitem3").text("Training & Development");
$("#tabitem3").attr("class","tablink");
$("#tabitem4").html("Employee<br>Communications");
$("#tabitem4").attr("class","vlin");
$("#tabitem5").text("");
// change global content
posGblContent("#C10","#gblD10");
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C10");
posGblContent("#C10","#gblD10");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C11");
posGblContent("#C11","#gblD11");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C12");
posGblContent("#C12","#gblD12");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C13");
posGblContent("#C13","#gblD3");
});
break;
}
}
$(document).ready(function()
{
alert("hello");
// change state of inner tabs
toggleImgMenu("#menu1",0);
// change visibility of RADEditors
toggleContent("#C1");
// change state of outer tabs
$("#day1").attr("class","current");
$("#week1").attr("class","active");
$("#month1").attr("class","active");
// change texts of menus
$("#tabitem1").html("Payroll, Benefits,<br>& Personal Information");
$("#tabitem2").text("Business Overview");
$("#tabitem3").text("Office Resources");
$("#tabitem4").text("Online Assignments");
$("#tabitem5").text("");
//change positions of global content
posGblContent("#C1","#gblD1");
//$("#globalContent").css({"position":"absolute","top": $("#C1").height() - 3 + "px", "left":"0px"});
$("#tabitem1").click(function()
{
toggleImgMenu("#menu1",0);
toggleContent("#C1");
posGblContent("#C1","#gblD1");
});
$("#tabitem2").click(function()
{
toggleImgMenu("#menu2",0);
toggleContent("#C2");
posGblContent("#C2","#gblD2");
});
$("#tabitem3").click(function()
{
toggleImgMenu("#menu3",0);
toggleContent("#C3");
posGblContent("#C3","#gblD3");
});
$("#tabitem4").click(function()
{
toggleImgMenu("#menu4",0);
toggleContent("#C4");
posGblContent("#C4","#gblD4");
});
});
</script>
我添加的唯一東西是alert(「hello」);檢查代碼是否正在呈現onload,而不是:(我在開發環境中的其他頁面中注意到這種疾病。我創建的新頁面無法渲染jQuery頁面:(
請幫忙:(
你在哪裏放置jQuery庫腳本包括? – Dexter