美文网首页
动态append添加内容,其中onclick传递参数无效

动态append添加内容,其中onclick传递参数无效

作者: 小本YuDL | 来源:发表于2019-10-30 21:54 被阅读0次

突然要交项目,还要写原生的,我好难哇,所以又遇到问题啦!


问题: 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);
    }

相关文章

网友评论

      本文标题:动态append添加内容,其中onclick传递参数无效

      本文链接:https://www.haomeiwen.com/subject/ubbavctx.html