使用 append() 附加大块 html [英] Appending large block of html with append()

问题描述

我正在尝试使用 jquery 的 append() 附加一大块文本.

$('#add_contact_btn').click(function(event) {event.preventDefault();var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>共同借款人信息</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label>名字</label><br/><input type="text"/><br/><label>中间名</label><br/><input type="text"/><br/><label>姓氏</label><br/><input type="text"/><br/><label>家庭电话号码</label><br/><input type="text"/><br><label>工号</label><br/><input type="text"/><br><label>细胞编号</label><br/><input type="text"/><br>

';$('#accordion_container').append(large);});

它似乎不起作用，在查看了 append() 的文档后，我不明白为什么 - 有什么想法吗?是我要附加的大量 HTML 吗?

解决方案

删除换行符.

http://jsfiddle.net/DmERt/

var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>共同借款人信息</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label>名字</label><br/><input type="text"/><br/><label>Middle Name</label><br/><input type="text"/><br/><label>Last Name</label><br/><input type="text"/><br/><label>首页编号</label><br/><input type="text"/><br><label>工号</label><br/><input type="text"/><br><label>单元格编号</label><br/><input type="text"/><br></div></div>';$('#accordion_container').append(large);

Im trying to append a large block of text using jquery's append().

$('#add_contact_btn').click(function(event) {
    event.preventDefault();

    var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>Co-Borrower Information</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label> First Name</label><br/><input type="text"/><br/><label>Middle Name</label><br/>
            <input type="text"/><br/>
            <label>Last Name</label><br/>
            <input type="text" /><br/>
            <label>Home Number</label><br/>
            <input type="text"/><br>
            <label>Work Number</label><br/>
            <input type="text"/><br>
            <label>Cell Number</label><br/>
            <input type="text"/><br>
            </div>
            </div>';

    $('#accordion_container').append(large);



});

It doesn't seem to be working and after looking at the documentation for append(), I can't figure out why - any ideas? Is it the large amount of HTML that I am trying to append?

解决方案

Remove the line breaks.

http://jsfiddle.net/DmERt/

var large = '<div class="accordian_container"><a href="#" class="accordian_trigger"><h4>Co-Borrower Information</h4></a><hr/><div class="accordian_item" id="accord_item_2"><label> First Name</label><br/><input type="text"/><br/><label>Middle Name</label><br/><input type="text"/><br/><label>Last Name</label><br/><input type="text" /><br/><label>Home Number</label><br/><input type="text"/><br><label>Work Number</label><br/><input type="text"/><br><label>Cell Number</label><br/><input type="text"/><br></div></div>';

$('#accordion_container').append(large);​

这篇关于使用 append() 附加大块 html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！