Javascript 永远不会执行图像中的onclick_Javascript

Javascript 永远不会执行图像中的onclick

javascript

Javascript 永远不会执行图像中的onclick,javascript,Javascript,我有一张图片，上面有两个代码，问题是当它被点击时，什么都没有发生。 <div style="float: left;"><input onload="setValue()" type="image" src="img/board new/blank.png" name="saveForm" class="btTxt submit" id="spinner" onclick="spin()" /> </div> 这是我的全部代码 <html>

我有一张图片，上面有两个代码，问题是当它被点击时，什么都没有发生。

<div style="float: left;"><input onload="setValue()" type="image" src="img/board new/blank.png" name="saveForm" class="btTxt submit" id="spinner" onclick="spin()" />  </div>

这是我的全部代码

<html>

<style>

body {
    background-image: url(img/background4.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}


</style>

<script>

var stop = false;
var spinResult;
var gameOver = false;
var oldHTML;
var newHTML;

function setValue() {

var rollResult = location.search.substr(location.search.indexOf("=")+1);
document.getElementById('own').innerHTML = "You own " + rollResult + " piece(s) on the board.";

}

function advanceSpinner(i) {
i = i || 1;

if (stop == false) {
if (i > 10) 
i = 1; // change this to return if you don't want to run forever
document.getElementById("spinner").src = "img/board new/" + i + ".png";
spinResult = i;
setTimeout(function () { advanceSpinner(i + 1) }, 50);
}
}



function spin() {

var start = Math.floor(Math.random() * (10 - 1 + 1)) + 1
advanceSpinner(start);
setTimeout(function () {stop = true;}, 4000);
setTimeout(function () {checkWin();}, 4050);

}

function checkWin() {
/*
if (rollResult == 1 && spinResult == 1) {
    alert("Win");
} else if (rollResult == 2 && spinResult == 1) {
    alert("Win");
} else if (rollResult == 2 && spinResult == 3) {
    alert("Win");
} else if (rollResult == 3 && spinResult == 1) {
    alert("Win");
} else if (rollResult == 3 && spinResult == 3) {
    alert("Win");
} else if (rollResult == 3 && spinResult == 6) {
    alert("Win");
} else if (rollResult == 4 && spinResult == 1) {
    alert("Win");
} else if (rollResult == 4 && spinResult == 3) {
    alert("Win");
} else if (rollResult == 4 && spinResult == 6) {
    alert("Win");
} else if (rollResult == 4 && spinResult == 8) {
    alert("Win");
}
*/

var fadeEffect=function(){
    return{
        init:function(id, flag, target){
            this.elem = document.getElementById(id);
            clearInterval(this.elem.si);
            this.target = target ? target : flag ? 100 : 0;
            this.flag = flag || -1;
            this.alpha = this.elem.style.opacity ? parseFloat(this.elem.style.opacity) * 100 : 0;
            this.elem.si = setInterval(function(){fadeEffect.tween()}, 20);
        },
        tween:function(){
            if(this.alpha == this.target){
                clearInterval(this.elem.si);
            }else{
                var value = Math.round(this.alpha + ((this.target - this.alpha) * .05)) + (1 * this.flag);
                this.elem.style.opacity = value / 100;
                this.elem.style.filter = 'alpha(opacity=' + value + ')';
                this.alpha = value
            }
        }
    }
}();


</script>

<head>
<title>Power Up! - Spin</title>
</head>

<body>

<div style="float: left;"><input onload="setValue()" type="image" src="img/board new/blank.png" name="saveForm" class="btTxt submit" id="spinner" onclick="spin()" />  </div>

</br>
<h2 id="own"> </h1>

<h1 id='result'> </h1>

</body>


</html>


身体{
背景图片：url（img/background4.png）；
背景大小：100%100%；
背景重复：无重复；
}
var-stop=false；
var结果；
var gameOver=false；
var-oldHTML；
var-newHTML；
函数setValue（）{
var rollResult=location.search.substr（location.search.indexOf（“=”）+1）；
document.getElementById（'own'）.innerHTML=“板上您拥有的”+rollResult+”块。”；
}
功能高级微调器（i）{
i=i | | 1；
如果（停止==false）{
如果（i>10）
i=1；//如果不想永远运行，请将此更改为返回
document.getElementById（“微调器”）.src=“img/board new/”+i+”.png”；
spinResult=i；
setTimeout（函数（）{advanceSpinner（i+1）}，50）；
}
}
函数自旋（）{
var start=Math.floor（Math.random（）*（10-1+1））+1
高级羽翼机（启动）；
setTimeout（函数（）{stop=true；}，4000）；
setTimeout（函数（）{checkWin（）；}，4050）；
}
函数checkWin（）{
/*
如果（rollResult==1&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==2&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==2&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==6）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==6）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==8）{
警惕（“胜利”）；
}
*/
var fadeEffect=函数（）{
返回{
初始化：函数（id、标志、目标）{
this.elem=document.getElementById（id）；
clearInterval（this.elem.si）；
this.target=target？target:flag？100:0；
this.flag=flag | |-1；
this.alpha=this.elem.style.opacity？parseFloat（this.elem.style.opacity）*100:0；
this.elem.si=setInterval（function（）{fadeEffect.tween（）}，20）；
},
吐温：函数（）{
if（this.alpha==this.target）{
clearInterval（this.elem.si）；
}否则{
var值=数学舍入（this.alpha+（（this.target-this.alpha）*.05））+（1*this.flag）；
this.elem.style.opacity=值/100；
this.elem.style.filter='alpha（不透明度='+value+'）；
此值为0.alpha=值
}
}
}
}();
通电！-旋转

我使用JSFIDLE查看了您的源代码，我纠正了许多类似“；”结束语句：

函数setValue（）{
rollResult=location.search.substr（location.search.indexOf（“=”）+1）；
}
var-stop=false；
var结果；
var gameOver=false；
var-oldHTML；
var-newHTML；
var结果；
var启动；
函数setValue（）{
rollResult=location.search.substr（location.search.indexOf（“=”）+1）；
//document.getElementById（'own'）.innerHTML=“板上您拥有的”+rollResult+”块。”；
}
功能高级微调器（i）{
控制台日志（i）；
i=i | | 1；
控制台日志（停止）；
如果（停止==错误）{
如果（i<10）{
//i=1；
document.getElementById（“微调器”）.src=“img/board new/”+i+”.png”；
spinResult=i；
setTimeout（函数（）{
高级羽翼机（i+1）；
}, 50);
}
}
}
函数自旋（）{
警报（“正在执行测试”）；
start=Math.floor（Math.random（）*（10-1+1））+1；
高级羽翼机（启动）；
setTimeout（函数（）{
停止=真；
}, 4000);
setTimeout（函数（）{
checkWin（）；
}, 4050);
}
函数checkWin（）{
/*
如果（rollResult==1&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==2&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==2&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==3&&spinResult==6）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==1）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==3）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==6）{
警惕（“胜利”）；
}else if（rollResult==4&&spinResult==8）{
警惕（“胜利”）；
}
*/
}
var fadeEffect=函数（）{
返回{
初始化：函数（id、标志、目标）{
this.elem=document.getElementById（id）；
clearInterval（this.elem.si）；
this.target=target？target:flag？100:0；
this.flag=flag | |-1；
this.alpha=this.elem.style.opacity？parseFloat（this.elem.style.opacity）*100:0；
this.elem.si=setInterval（函数（）{
fadeEffect.tween（）；
}, 20);
},
吐温：函数（）{
if（this.alpha==this.target）{
clearInterval（this.elem.si）；
}否则{
var值=数学舍入（this.alpha+（（this.target-this.alpha）*0.05））+（1*this.flag）；
this.elem.style.opacity=值/100；
this.elem.style.filter='alpha（不透明度='+value+'）；
这个α=值；
}
}
};
}();

这就是你要找的吗

编辑：

我纠正了这个问题，你现在能检查一下你的问题吗？不应该

if (i > 10)

是

到

否则它永远不会结束

我还建议将

更改为全局

var spinCount

，否则您可能会将

与其他变量混淆。

工作查看conso

if (i > 10)

if (i < 10)

setTimeout(function () { advanceSpinner(i + 1); }, 50);

i++;
setTimeout(function () { advanceSpinner(i); }, 50);

var stop = false;
function setValue() {
rollResult = location.search.substr(location.search.indexOf("=") + 1);
}

function spin() {

var start = Math.floor(Math.random() * (10 - 1 + 1)) + 1;
advanceSpinner(start);
setTimeout(function () {
    stop = true;
}, 4000);
//setTimeout(function () {checkWin();}, 4050);
}

function advanceSpinner(i) {
  i = i || 1;
  if (!stop) {
    if(i > 10)i = 1;
        console.log("img/board new/" + i + ".png");
        document.getElementById("spinner").src = "img/board new/" + i + ".png";
        spinResult = i;
        setTimeout(function () {
            advanceSpinner(i + 1);
        }, 50);

   }


    var spinResult;
    var gameOver = false;
    var oldHTML;
    var newHTML;
    var rollResult;
    var start;

   function setValue() {

    rollResult = location.search.substr(location.search.indexOf("=") + 1);
    //document.getElementById('own').innerHTML = "You own " + rollResult + " piece(s) on the   board.";

    }
}


function checkWin() {
 /*
if (rollResult == 1 && spinResult == 1) {
 alert("Win");
} else if (rollResult == 2 && spinResult == 1) {
 alert("Win");
} else if (rollResult == 2 && spinResult == 3) {
  alert("Win");
} else if (rollResult == 3 && spinResult == 1) {
alert("Win");
} else if (rollResult == 3 && spinResult == 3) {
alert("Win");
} else if (rollResult == 3 && spinResult == 6) {
alert("Win");
} else if (rollResult == 4 && spinResult == 1) {
alert("Win");
} else if (rollResult == 4 && spinResult == 3) {
alert("Win");
} else if (rollResult == 4 && spinResult == 6) {
alert("Win");
} else if (rollResult == 4 && spinResult == 8) {
alert("Win");
}
*/
}

var fadeEffect = function () {
return {
    init: function (id, flag, target) {
        this.elem = document.getElementById(id);
        clearInterval(this.elem.si);
        this.target = target ? target : flag ? 100 : 0;
        this.flag = flag || -1;
        this.alpha = this.elem.style.opacity ? parseFloat(this.elem.style.opacity) * 100 : 0;
        this.elem.si = setInterval(function () {
            fadeEffect.tween();
        }, 20);
    },
    tween: function () {
        if (this.alpha == this.target) {
            clearInterval(this.elem.si);
        } else {
            var value = Math.round(this.alpha + ((this.target - this.alpha) * 0.05)) + (1 * this.flag);
            this.elem.style.opacity = value / 100;
            this.elem.style.filter = 'alpha(opacity=' + value + ')';
            this.alpha = value;
        }
     }
 };
}();