[英]How to return function in document ready?
I don't know if it is possible to do this, like I have 2 js files.我不知道是否可以这样做,比如我有 2 个 js 文件。 The first Js File:
第一个 Js 文件:
var news_pos, about_pos, services_pos, clients_pos;
function define_pos() {
var $top_slides=$('#top_slides'),
$mid_nav=$('#mid_nav'),
$news_section=$('#section-1');
var fixed_height = $top_slides.height() + $mid_nav.height();
news_pos = fixed_height - 20;
about_pos = fixed_height + $news_section.height();
services_pos = fixed_height + $news_section.height() * 2;
clients_pos = fixed_height + $news_section.height() * 3;
}
$(document).ready(function() {
var section_news = $('#section-1'),
section_about = $('#section-2'),
section_services = $('#section-3'),
section_clients = $('#section-4');
setheight();
function setheight() {
var section_height = $(window).height() + 200;
$section_news.height(section_height);
$section_about.height(section_height);
$section_services.height(section_height);
$section_clients.height(section_height);
define_pos();
}
});
The second JS File:第二个JS文件:
$(document).ready(function() { $(document).ready(function() {
var nav = { '$btn1': $('#btn1'), '$btn2': $('#btn2'), '$btn3': $('#btn3'), '$btn4': $('#btn4'), '$btn5': $('#btn5'), myclick : function() { myclicked(nav.$btn1, 0); myclicked(nav.$btn2, news_pos); myclicked(nav.$btn3, about_pos); myclicked(nav.$btn4, services_pos); myclicked(nav.$btn5, clients_pos); function myclicked(j,k) { j.click(function(e) { e.preventDefault(); $('html,body').animate({scrollTop: k}, 1000); }); } // Is it right to do return{'myclick':myclick}, // how to call? seems not logical } }; // Here will not work because it say news_pos is undefined. // If I use setTimeout(nav.myclick,1000), it will works but // I want to run it right the when position is caculated. nav.myclick();
}); });
How do I pass the nav.myclick() function to the frist js file and put it in setheight() and under define_pos()?如何将 nav.myclick() 函数传递给第一个 js 文件并将其放在 setheight() 和 define_pos() 下? By the way writing codes right in stackoverflow is strange,press tab not really give you any spacing.
顺便说一句,在 stackoverflow 中正确编写代码很奇怪,按 Tab 键并没有真正给你任何间距。
Right now, function setheight(){ }
is an internal function in the first $(document).ready(function(){}
. Its "scope" (visibility) is limited to inside that function.现在,
function setheight(){ }
是第一个$(document).ready(function(){}
的内部函数。它的“范围”(可见性)仅限于该函数内部。
To make it visible to everyone, you need to move it outside of $(document).ready(function(){}
.要使其对所有人可见,您需要将其移到
$(document).ready(function(){}
。
Then, declare the first file before the second one, and functions in the second file can now use setheight()
.然后,在第二个文件之前声明第一个文件,第二个文件中的函数现在可以使用
setheight()
。
To use myClick
:要使用
myClick
:
Your function now is myclicked()
so you need to change that to myclick()
.您的函数现在是
myclicked()
因此您需要将其更改为myclick()
。 Then, you can call the functions in the global scope:然后,您可以调用全局范围内的函数:
function myclick(j,k){
j.click(function(e) {
e.preventDefault();
$('html,body').animate({scrollTop: k}, 1000);
setheight();
define_pos();
}
Here's one way to namespace your position functions per your "new" question in the comments.这是根据评论中的“新”问题命名位置函数的一种方法。 It's pure JS, not JQuery, but it's the same anyway:
它是纯 JS,而不是 JQuery,但无论如何都是一样的:
var POSITIONING = {
news_pos : 0,
about_pos : 0,
services_pos : 0,
clients_pos : 0,
define_pos : function() {
var fixed_height = 100;
POSITIONING.news_pos = fixed_height; // + whatever
POSITIONING.about_pos = fixed_height; // + whatever
POSITIONING.services_pos = fixed_height; // + whatever
POSITIONING.clients_pos = fixed_height; // + whatever
},
set_height : function() {
alert(this.news_pos)
}
};
Put this in a JS file, load it before any other files that use it, and call as follows:把它放在一个 JS 文件中,在任何其他使用它的文件之前加载它,并调用如下:
// For example, when the window loads...or document is ready, whatever
window.onload = function() {
POSITIONING.define_pos();
POSITIONING.set_height();
};
It's also worth noting that it looks like this could be done more efficiently with CSS using a margin or padding or something.还值得注意的是,看起来这可以通过使用边距或填充或其他东西的 CSS 更有效地完成。 Probably a lot easier.
可能会轻松很多。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.