Reputation: 1478
I would like to examine the source code for a JavaScript function in a web page
In Firefox Inspector, I've clicked on
I see:
<a href="/thread/7629335?start=75&tstart=0" title="last" onclick="jspaginate.init('last', '6'); return false;" class="js-pagination-next j-paginate-last">last</a>
I would like to find the source to jspaginate.init
. I've clicked on the Debugger tab, but I do not see jspaginate.init
. The source should be on the page somewhere, shouldn't it?
I'm running Firefox 48.0 in Mac OS 10.10.5. I'm in the Inspector.
Upvotes: 5
Views: 34234
Reputation: 666
In firefox open the desired page, press F12 to open the developer tools. In the "debugger" tab press ctrl + shift + F (Search in files) and search for "jspaginate". It will present you all the files containing that word.
Firefox Developer Tools - Search
Firefox Developer Tools: search for files with the debugger (Video)
Or with FireBug that is no longer supported in Firefox >57*
Install firebug, activate it, activate the script panel too and then look for the jspaginate object. In a js file you will find it:
var jspaginate = {
data:{},
loading: false,
init: function(action, last){
var view = this,
target, current;
if(this.loading !== true){
view.loadingSequence();
if(action === 'first'){
target = 0;
view.update(target, 0);
}else if(action === 'prev'){
current = parseInt(view.data.pageIndex)-1;
target = (current)*view.data.range;
view.update(target, current);
}else if(action === 'next'){
current = parseInt(view.data.pageIndex)+1;
target = (current)*view.data.range;
view.update(target, current);
}else if(action === 'last'){
current = parseInt(last)-1;
target = (current)*view.data.range;
view.update(target, current);
}
}
},
update: function(target, current){
this.data.pageIndex = current;
this.pushState(target, current);
this.getData(target);
},
pushState: function(target, current){
var state = { 'page_id': current, 'user_id': 2 },
title = 'Page'+ current,
url = '?start='+target+'&tstart=0';
history.pushState(state, title, url);
},
loadingSequence: function(){
this.loading = true;
$j('.j-pagination').append('<div class="j-loading-big"><span></span></div>');
$j('.all-replies-container').css('opacity','.5');
},
removeLoading: function(){
$j('.j-loading-big').remove();
$j('.all-replies-container').css('opacity','1');
this.loading = false;
},
updateUI: function(data){
$j('.all-replies-container').html(data);
$j('html, body').animate({
scrollTop: ($j(".all-replies-container").offset().top -180)
}, 800);
this.removeLoading();
},
getData: function(target){
var view = this,
tId = (this.data.threadId).split('/')[2],
urlString = jive.app.url({path:'/inline-thread.jspa?thread='+tId+'&start='+target+'&tstart=0'});
$j.ajax({
url: urlString,
cache: true,
async: true,
type:'POST',
dataType : 'html'
}).success(function(data) {
view.updateUI(data);
}).error(function(data) {
console.log(data);
});
}
}
;
Upvotes: 6
Reputation: 8971
Here are the steps to find the JavaScript method.
Debugger
tab.Firefox 57.0.4 seems to be buggy. It shows no sign that it is doing anything. Eventually, the results will appear. However, each press of Enter will cause that many sets of results to be displayed.
Upvotes: 0
Reputation: 319
If you click on the console tab, you will see a bunch os js files are loaded. You probably can find that function in one of them.
Most of them seem to be minified, if not all, so finding this function might be difficult.
It could also be in a <script>
tag, but still, might not be easy to find.
Upvotes: 0