动态append添加内容,其中onclick传递参数无效
2019-10-30  本文已影响0人 
小本YuDL
突然要交项目,还要写原生的,我好难哇,所以又遇到问题啦!
问题: append添加一个删除框,且传入了删除的id,但是点击删除的时候,触发删除的onclick时,却找不到传入的参数id,所以也没办法发出删除请求了。
明明传入了,但是就是找不到,头很大哇。
原因:
- 用append添加的话,调用ajax返回参数添加参数到onclick中就会出现数据不能显示,整个js模块失效的情况。
- onclick参数中如果包含整数又包含字符串的话,必须要给参数加单引号。
 而单引号在append中又 默认成分割符,这样就无法正常输出参数了,即便输出了参数也都是不带单引号的参数,这样的参数会让你写的function不起作用。
- 注意:在append中要写单引号的时候用转义符,要写单引号/'一个斜杠加单引号才是单引号!
写法:
- 
参数是变量的话 :得用${},因为是模板字符串 即:DeleteView(${viewId})
- 
参数是字符串的话 :DeleteView(\'viewId\')
- 
参数是数字的话 :可直接写DeleteView(1)
代码示例:
function viewDeleteLoad(viewId) {
    let con = $(` 
         <div class="card-body" >
            <h4 class="card-title" >提示</h4>
            <p>确认要删除吗?</p>
             <hr>
             <div style="text-align: right">
              <button class="btn_sub btn " onclick="closeDelWindow()">取消</button>
              <button class="btn_sub btn" onclick="DeleteView(${viewId})">确 定</button>
            </div>
        </div>`);
        $('#delete_view').append(con);
    }


