由于某种原因,只有在startSpin()函数中定义了微调器对象时,它才起作用。
这是非工作代码:
<script type="text/javascript" src="resources/js/spin.js"></script>
<script type="text/javascript">
var opts = {
lines: 18, // The number of lines to draw
length: 40, // The length of each line
top: 'auto', // Top position relative to parent in px
left: 'auto' // Left position relative to parent in px
};
// -- not support ?
var target = document.getElementById('spin');
var spinner = new Spinner(opts).spin(target);
// -- ???
function startSpin()
{
spinner.start();
}
function stopSpin()
{
spinner.stop();
}
function showStatus() {
startSpin();
statusDialog.show();
}
function hideStatus() {
stopSpin();
statusDialog.hide();
}
</script>
<h:form id="testfm">
<p:commandButton id="start" type="submit"
ajax="false"
value="test"
actionListener="#{bean.test}"
onclick="PrimeFaces.monitorDownload(showStatus, hideStatus)"/>
<p:dialog modal="true"
widgetVar="statusDialog"
showHeader="false"
draggable="false"
closable="false"
resizable="false">
<div id="spin" class="spinner"/>
</p:dialog>
</h:form>
只有在spinStart函数
中定义微调器时,它才起作用我尝试使用脚本位置,但仍然得到相同的消息 知道为什么吗?
由于
答案 0 :(得分:2)
您在该函数之外运行document.getElementById('spin')
,尚未创建具有id=spin
的元素,因此您将为微调器提供空值。如果您在startSpin
内创建它,它是对用户的click事件的响应,因此DOM可能已在此时构建并且元素存在。这是一个解决方法:
var spinner; //Lave the variable out here so both functions can see it
function startSpin() {
var target = document.getElementById('spin');
spinner = new Spinner(opts).spin(target); //Actually create it here, when the element exists
spinner.start();
}
function stopSpin() {
spinner.stop();
}
您也可以保留代码,并将其放在文档末尾,就在</body>
代码之前。