今天写一个上传的项目的时候 报错 Uncaught RangeError: Maximum call stack size exceeded 大概意思是说我超出了最大调用堆栈的范围。然后检查代码发现了一个问题 代码如下:
<a class="" >
<label for="">头像</label>
<div class="head-box" onclick="selectImgs()" ><img src="/a.jpg" style="width: 48px;height: 48px;"/>
<input type="file" accept="images/*" enctype="multipart/form-data" name="image[]" id="selectInputs" onchange="uploadMores()">
</div>
</a>
如上所示 我在 class为head-box的这个div上面写了一个onclick事件 又在当前元素的子元素 input里面写了一个 onchange事件
function selectImgs() {
$("#selectInputs").click();
}
function uploadMores() {
alert(3);
}
错误的原因是因为:出现了无限循环
我在调用的时候 先点击click事件 然后调用了change事件 然后又调用了click事件… 一直无线循环 所以才报错
解决方法:就是不要咋子元素里面调用另一个套起来的事件方法 即可完美避免该类问题