Question

我正在使用jQuery在按钮后插入一些html，单击该按钮时单击

以下功能效果很好：

$(document).ready(function(){       
    $('#someid').click(function() {     
        $('<div>Hello world</div>').insertAfter($('#someid').parent());                
     });
});

我发现了两件我不理解的事情：

1

   $(document).ready(function(){        
        $('#someid').click(function() {     
            $('<div>Hello world</div>
               <div>another div</div>    <p>some html</p>


               <div>weird spacing</div>
              ').insertAfter($('#someid').parent());                
         });
    });

不起作用，即在元素之间引入空格（或换行符？）会导致函数失败。

2

$(document).ready(function(){       
    $('#someid').click(function() {     
        $('Im just a string not good HTML').insertAfter($('#someid').parent());                
     });
});

同样失败，似乎我没有插入有效的HTML作为函数的参数，它不插入它？

2）只是一个好奇心但1）阻止我粘贴大量的HTML，如果点击按钮，我想要插入HTML，我是否必须删除所有空格？

Answer 1

这是因为转义字符的转义用法。

换行符在javascript中被视为语句的结尾，您可以在末尾使用\以字符串文字转义它

   $(document).ready(function(){        
        $('#someid').click(function() {     
            $('<div>Hello world</div>\
               <div>another div</div>    <p>some html</p>\
               \
               \
               <div>weird spacing</div>\
              ').insertAfter($('#someid').parent());                
         });
    });

此外，由于您已使用'包含字符串，因此字符串中的任何实例也必须使用\进行转义

$(document).ready(function(){       
    $('#someid').click(function() {     
        $('I\'m just a string not good HTML').insertAfter($('#someid').parent());                
     });
});

javascript / jQuery“insertAfter”函数参数中的空格导致失败

1 个答案: