0
我對jQuery非常陌生，想知道我的代碼在部署到世界時是否會工作，而不是在本地進行測試。爲什麼我將jquery var放在代碼的末尾而不是在開頭？
我有一個相當大的代碼塊填充（幾個）其他東西之間的某些表單元素。當我將這段代碼放到文檔就緒部分後面的腳本頂部時，它不起作用。如果我把它放在腳本的底部，它確實有效。這讓我有點擔心，當頁面在服務器上時，信息無法正常加載。
var headBkg = $('#header').css('background-image'); //gets the background image url
$('#header_imgURL').attr('value', headBkg); //populates a form field with the url for later use
我該如何知道這件事，以確保我不會執行某些在生產服務器上不起作用的東西？我怎樣才能讓這種類型的東西工作？
$(document).ready(function() {
// Begin Modal Window //
// get the height and width of the page
var window_width = $(window).width();
var window_height = $(window).height();
//vertical and horizontal centering of modal window(s)
/*we will use each function so if we have more then 1
modal window we center them all*/
$('.modal_window').each(function(){
//get the height and width of the modal
var modal_height = $(this).outerHeight();
var modal_width = $(this).outerWidth();
//calculate top and left offset needed for centering
var top = (window_height-modal_height)/2;
var left = (window_width-modal_width)/2;
//apply new top and left css values
$(this).css({'top' : top , 'left' : left });
});
$('.activate_modal').click(function(){
//get the id of the modal window stored in the name of the activating element
var modal_id = [$(this).attr('name'), $(this).attr('id')];
//var
// This is the original working code // var modal_id = $(this).attr('name');
//alert($(this).attr('id'));
//var theform = $(this).attr('id');
//use the function to show it
show_modal(modal_id);
});
$('#cancel').click(function(){
//use the function to close it
close_modal();
});
$('.close_modal').click(function(){
//use the function to close it
close_modal();
});
//});
//THE FUNCTIONS
function close_modal(){
//hide the mask
$('#mask').fadeOut(500);
//hide modal window(s)
$('.modal_window').fadeOut(500);
}
function show_modal(modal_id){
//set display to block and opacity to 0 so we can use fadeTo
$('#mask').css({ 'display' : 'block', opacity : 0});
//fade in the mask to opacity 0.8
$('#mask').fadeTo(500,0.7);
//show the modal window
$('#'+modal_id[0]).fadeIn(500);
// Use this if statement to dertermine whether to serve up the upload or the other script
if (modal_id[1] == "backer")
{
var jForm = $("#uploadform");
jForm.submit(function(objEvent){
var jThis = $(this);
var strName = ("uploader" + (new Date()).getTime());
var jFrame = $("<iframe name=\"" + strName + "\" src=\"about:blank\" />");
jFrame.css("display", "none");
jFrame.load(function(objEvent){
var objUploadBody = window.frames[ strName ].document.getElementsByTagName("body")[ 0 ];
var jBody = $(objUploadBody);
var objData = eval("(" + jBody.html() + ")")
var thumb = ('thumbnails/' + eval(jBody.html()));
var title = $("#image_title").val();
//Populates the title hidden field and
//will serve as a string for the naming convention
var alt = $("#image_alt").val();
// alt text could be the same as the title possibly...
// ----------- //
//Put an if statement to set the elments that need the preview image
$("#header").css("background", "url(" + thumb + ") no-repeat center");
$("#preview").attr("src", thumb);
$("#thebackgroundimage").attr("value", thumb);
$("#theimagetitle").attr("value", title);
// ----------- //
setTimeout(function(){
jFrame.remove();
},100);
});
$("body:first").append(jFrame);
jThis
.attr("action", "upload_act_single.cfm")
.attr("method", "post")
.attr("enctype", "multipart/form-data")
.attr("encoding", "multipart/form-data")
.attr("target", strName);
});
// End Image Upload //
// In the future this is poulated with the data from the ColdFusion query
$('#preview').attr("src", "images/cfr_footwear_header_bkg.jpg");
}
}
// END of the Modal Window script //
// Replace the background image on the header //
// write this code when the cf query is ready to go //
//<!---$("#header").css("background-image", "url(<cfoutput>#headerbg#</cfoutput>) no-repeat center"); --->//
$("#header").css("background", "url(images/cfr_footwear_header_bkg.jpg) no-repeat center");
//jQuery scroller for the FarmNews on the index page //
$(function() {
$(".farmnews").jCarouselLite({
vertical: true,
visible: 4,
auto:2500,
speed:400,
hoverPause:true
});
});
// jQuery scroller for the mid-page specials //
$(function() {
$(".slideshow").jCarouselLite({
vertical: false,
visible: 1,
auto:4500,
speed:1000,
easing:"easeinout",
hoverPause:true
});
});
// This is to replace text in the input fields //
$('.textbox').click(function() {
if (this.value == this.defaultValue) {
this.value = '';}
});
$('.textbox').blur(function() {
if (this.value == '') {
this.value = this.defaultValue;}
});
var headBkg = $('#header').css('background-image');
var win1_img = [$('#window_one img').attr('src'), $('#window_one img').attr('title'), $('#window_one img').attr('alt') ]
$('#header_imgURL').attr('value', headBkg);
$('#win1_imgURL').attr('value', win1_img[0]);
$('#win1_imgTitle').attr('value', win1_img[1]);
$('#win1_imgAlt').attr('value', win1_img[2]);
});
這裏有整個shebang！它仍在發展中，所以請忽略我在地方看到的毫無意義的評論。
你不應該把你的代碼**在文檔準備好部分之後**，但** **在'document.ready'部分之後.. – 2010-06-28 22:46:05