JS中onclick事件的一个坑

今天碰见的这个问题并没有从源头上把它理解,只是通过一个变通的方式解决了这个bug…


<a href="javascript:void()" onclick="alertErrorMsg(${declareNumber},${aaa})">错误信息a> 

<a href="javascript:void()" onclick="alertErrorMsg(${declareNumber})">错误信息a>
//这是修改后的方法,只需要传入一个参数
function alertErrorMsg(declareNumber){
        var url = "xxxxxxxxx";
        var datas = {"declareNumber":declareNumber,_:new Date().getTime()};
        $.ajax({
            url:url,
            data:datas,
            type:"POST",
            success:function(data){
                var result = JSON.parse(data)["result"];
                //layer.alert(typeof JSON.parse(data)["errorList"]);
                var list = JSON.parse(data)["errorList"];
                if(result == 1){//成功,则解析json并遍历.
                    var str = "";
                    for(var i=0;i1)+"."+list[i]+"
"
; } layer.open({ type: 1, title:"错误信息", skin: 'layui-layer-rim', //加上边框 area: ['600px', '400px'], //宽高 content: str }); }else if(result == 2){//无数据 layer.alert('没有错误信息!!!'); }else{//否则失败,提示系统异常 layer.alert('系统异常!!!'); } }, error:function(){ layer.alert('系统错误!!!'); } }); }

A状态,我传入的是两个String类型,onclick没问题。
B状态,我传入的是一个String类型,onclick出现了错误提示:

//这里的fff30368a2774ee69ce41968a473a8ca 是传入的值
Uncaught ReferenceError: fff30368a2774ee69ce41968a473a8ca is not defined

在这里我跟公司中的前端讨论了很长时间,也没有一个头绪.

最后只能将bug解决,然后记录下来。

解决方法:


<a href="javascript:void()" id="errorMsg" class="btn btn-danger">错误信息a> 

<input type="hidden" id="declareNumber" value="${declareNumber }"/>
    //在dom元素加载完成后为指定的a标签绑定点击事件,然后调用上面的js方法与后台交互
    //注意这里的解决方法是页面存在这个标签
    $(function(){
        $("#errorMsg").click(function(){
            alertErrorMsg($("#declareNumber").val());
        });
    });
    //如果需要点击的事件是由js创建则使用此方法,此方法需要在创建的标签中加上指定的class
    $(function(){
        //$("#sample-table")是取要点击的元素的父级标签或者祖级标签
        //on("click",,".numberClass",function(){});则是查找id为sample-table的子孙标签中所有class为numberClass的标签,并为其绑定点击事件,在点击事件中出发alertErrorMsg()方法
        $("#sample-table").on("click",".numberClass",function(){
            alertErrorMsg($(this).attr("name"));
        });
    });


以上是这个问题的解决方法,但是如果有哪位知道原理的话,希望可以在评论中告知一下,万分感谢.
ps:这个问题出现的话,只是报js的错误,也就是浏览器中的console会打印错误,而不会进入到后台.

你可能感兴趣的:(js&jsp)