Javascript变量的全局作用域没有按预期工作
Global Scope in Javascript Variable Not working as expected
<html>
<body>
<div>
<button id="prev" onclick="goPrevious()">Previous</button>
<button id="next" onclick="goNext()">Next</button>
<span>Page: <span id="page_numo"></span> / <span id="page_count"></span></span>
<input type=text id="elNum" value=1>
</div>
<div>
<canvas id="the-canvas" style="border:0px solid black"></canvas>
</div>
<!-- Use latest PDF.js build from Github -->
<script type="text/javascript" src="https://raw.github.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script>
<script type="text/javascript">
//
// NOTE:
// Modifying the URL below to another server will likely *NOT* work. Because of browser
// security restrictions, we have to use a file server with special headers
// (CORS) - most servers don't support cross-origin browser requests.
//
var url = 'http://cdn.mozilla.net/pdfjs/tracemonkey.pdf';
//
// Disable workers to avoid yet another cross-origin issue (workers need the URL of
// the script to be loaded, and currently do not allow cross-origin scripts)
//
PDFJS.disableWorker = true;
var pdfDoc = null,
pageNum = 1,
scale = 0.8,
canvas = document.getElementById('the-canvas'),
ctx = canvas.getContext('2d');
//
// Get page info from document, resize canvas accordingly, and render page
//
function renderPage(num) {
// Using promise to fetch the page
pdfDoc.getPage(num).then(function(page) {
var viewport = page.getViewport(scale);
canvas.height = viewport.height;
canvas.width = viewport.width;
// Render PDF page into canvas context
var renderContext = {
canvasContext: ctx,
viewport: viewport
};
page.render(renderContext);
});
// Update page counters
document.getElementById('page_numo').textContent = pageNum;
document.getElementById('page_count').textContent = pdfDoc.numPages;
sic = document.getElementById('elNum');
sic.value = pageNum;
}
crc = 1;
//
// Go to previous page
//
function goPrevious() {
if (pageNum <= 1)
return;
pageNum--;
crc = pageNum;
renderPage(pageNum);
}
//
// Go to next page
//
function goNext() {
if (pageNum >= pdfDoc.numPages)
return;
pageNum++;
crc = pageNum;
renderPage(pageNum);
}
//
// Asynchronously download PDF as an ArrayBuffer
//
PDFJS.getDocument(url).then(function getPdfHelloWorld(_pdfDoc) {
pdfDoc = _pdfDoc;
renderPage(pageNum);
});
document.write ('Current page is '+crc);
</script>
</body>
</html>
这就是代码。它是在线pdf渲染器(pdf.js)的最简单版本。我一直在研究一个项目,需要通过url将pageNum(当前pdf页码)变量传递到另一个脚本进行处理。但问题是我没有办法检索pageNum值外的renderPage函数。我认为这是Javascript变量作用域的问题,但无法看到我试图通过crc变量或通过document.getElementById('elNum').value提取有什么问题…(见文件。write ('Current page is '+crc);查看脚本末尾的第一行和第8行的字段,以查看我是如何尝试检索值的)。
谁能告诉我我做错了什么?测试页面在这里(http://jsbin.com/pdfjs-prevnext-v2/2091/edit)
注意:我看过关于这个话题的其他问题,但这似乎是一个奇怪的情况。真的需要一些帮助,希望将来有人会需要它。
document.write ('Current page is '+crc)
仅在加载页面时执行。crc是一个全局变量,可以使用。
var viewCurrPage = function() {
console.log('Current page is '+crc);
};
function goPrevious() {
if (pageNum <= 1)
return;
pageNum--;
crc = pageNum;
renderPage(pageNum);
viewCurrPage();
};
function goNext() {
if (pageNum >= pdfDoc.numPages)
return;
pageNum++;
crc = pageNum;
renderPage(pageNum);
viewCurrPage();
}
这与vn_grv的简单函数结合起来可能很有用
var viewCurrPage = function() {
//console.log('Current page is '+crc);
document.getElementById('one').innerHTML = '<a href="process.php?page='+crc+'">Process page '+crc+'</a>';
};
//Simply adding the corresponding div like:
<div id="one"></div>
谢谢你的回答。最好的祝福,
相关文章:
- 我的django模板布尔变量是't在javascript中按预期工作
- 如何使Jquery编码的动态下拉菜单与PHP GET变量协调工作
- 如何获得一个与用“”声明的变量工作方式相同的变量;设“;或在with块中
- 递增 PHP 变量在 JSCRIPT 文档工作方面
- 变量只能在函数中局部工作,不能全局工作-Javascript
- 如何在jquery中为object键创建一个工作变量以避免额外的代码
- PHP:运行后变量不工作“;如果“;命令
- jQuery全局变量is't工作
- 具有范围变量的控制器不工作
- JavaScript 变量的作用域在此脚本中如何工作
- Javascript变量在没有var的情况下工作
- Javascript ORing在变量中的工作方式
- Javascript-将函数分配给变量dos'不能按预期工作
- 变量x工作不正常
- 全局变量确实'在script标记中的外部.js文件之后,nt工作
- 计算三角形面积-作为变量工作,但不作为函数包装
- Javascript变量作为数组工作
- 变量在Javascript中是如何工作的?可以在setTimeout期间更改变量值
- 如果快速切换,ng类在绑定变量上不能很好地工作,这可能吗
- 为什么这段代码不能工作?(变量对象键和值)