如何防止jQuery添加额外的空间' '在insertAfter函数中

时间:2018-03-29 01:09:39

标签: javascript jquery html5 onclick insertafter

此插入代码可以正常使用

<script>
    var X = 0;
    $(function () {
            X++;
            $("#AddNumber").on({ 'click': function () { $('<div class="form-row"><label><span>Another Number</span><input type="tel" name="Mobile' + X + '"><a><img onclick="$(this).closest("div").remove();" class="DeleteNumber" width="25" height="25" src="/Images/Delete.png" /></a></label></div>').insertAfter("#AddNumberAction"); } });
        }
    );

</script>

但是当我插入它之后检查它

Inspect Element on Google Chrome

这使它无法正常工作..

1 个答案:

答案 0 :(得分:0)

这是关于报价用法......

传递给.closest()的参数使用双引号传递。但双引号已包含onclick=字符串...

由于你正在创建的整个jQuery元素组已经使用单引号包装...然后,你应该在div周围使用一组转义单引号...就像<img onclick="$(this).closest(\'div\').remove();"

所以试试这样:

<script>
  var X = 0;
  $(function () {
    X++;
    $("#AddNumber").on({ 'click': function () { $('<div class="form-row"><label><span>Another Number</span><input type="tel" name="Mobile' + X + '"><a><img onclick="$(this).closest(\'div\').remove();" class="DeleteNumber" width="25" height="25" src="/Images/Delete.png" /></a></label></div>').insertAfter("#AddNumberAction"); } });
  });

</script>