由于未终止的字符串常量错误,添加的行不起作用

时间:2014-07-23 10:07:33

标签: javascript jquery

如何在表格中添加以下行?

我有错误

  

未终止的字符串常量,带有以下代码

<table id="myTable">
   <tbody>
      <tr>
          <td></td><td></td>
      </tr>
   <tbody>
</table>

$('#myTable tbody').append('<tr style="display: table-row;">
    ' <td style="width: 250px;">
                <select id="List" class="FixedWidth" onclick="this.style.width='auto';" onchange="this.blur();" onblur="this.style.width='250px';" style="display: none;">
                <div id="labelDiv"><label id="ComboBoxText"></label></div>
                <input id="TID" name="TID" type="hidden" value="0">
            </td>
            <td class="Cell KeyCell" style="display: none;">
                <input class="KeyInput" id="Key" maxlength="5" name="Key" placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>
                <textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>
                <input id="ID" name="ID" type="hidden" value="0">
            </td> </tr>'
    )

5 个答案:

答案 0 :(得分:3)

你的代码的问题是你没有使用字符串连接和你给出的方式.style.width = auto;也是错的。我希望这会有所帮助:

$('#myTable tbody').append(
     ' <td style="width: 250px;">'+
       '<select id="List" class="FixedWidth" onclick="this.style.width=auto;" onchange="this.blur();" onblur="this.style.width=250px;" sty"display: none;">'+
               ' <div id="labelDiv"><label id="ComboBoxText"></label></div>'+
                '<input id="TID" name="TID" type="hidden" value="0">'+
            '</td>'+
            '<td class="Cell KeyCell" style="display: none;">'+
               ' <input class="KeyInput" id="Key" maxlength="5" name="Key" placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>'+
 '<textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>'+
                '<input id="ID" name="ID" type="hidden" value="0">'+
            '</td>'

    )

演示:http://plnkr.co/edit/11cjEGd83tDOZwHaHB4p?p=preview

答案 1 :(得分:2)

您需要在每行的末尾添加\以及通过\'而不是'添加单引号来转义换行符。

JavaScript期望一个字符串在它启动的同一行中终止 - 这就是为什么它说“未终止的字符串......”。要告诉它它继续,你将不得不逃避换行。这就是反斜杠的用途。

此代码可以使用:

$('#myTable tbody').append(
    ' <td style="width: 250px;">\
                <select id="List" class="FixedWidth" onclick="this.style.width=\'auto\';" onchange="this.blur();" onblur="this.style.width=\'250px\';" style="display: none;">\
                <div id="labelDiv"><label id="ComboBoxText"></label></div>\
                <input id="TID" name="TID" type="hidden" value="0">\
            </td>\
            <td class="Cell KeyCell" style="display: none;">\
                <input class="KeyInput" id="Key" maxlength="5" name="Key" placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>\
                <textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>\
                <input id="ID" name="ID" type="hidden" value="0">\
            </td>'
    );

答案 2 :(得分:1)

你的代码。字符串连接的概念

 '<td style="width: 250px;">'+
       '<select id="List" class="FixedWidth" onclick="this.style.width=\'auto\'" onchange="this.blur()" onblur="this.style.width=\'250px\'" sty"display: none;">'+
               ' <div id="labelDiv"><label id="ComboBoxText"></label></div>'+
                '<input id="TID" name="TID" type="hidden" value="0">'+
            '</td>'+
            '<td class="Cell KeyCell" style="display: none;">'+
               ' <input class="KeyInput" id="Key" maxlength="5" name="Key" placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>'+
 '<textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>'+
                '<input id="ID" name="ID" type="hidden" value="0">'+
            '</td>'

答案 3 :(得分:0)

你必须使用html操作break将这一切concatination改为一行或+这些巨大的字符串

$('#myTable tbody').append(

    ' <td style="width: 250px;">'+
                '<select id="List" class="FixedWidth" onclick="this.style.width=\'auto\'" onchange="this.blur()" onblur="this.style.width=\'250px\'" style="display: none">'+
                '<div id="labelDiv"><label id="ComboBoxText"></label></div>'+
                '<input id="TID" name="TID" type="hidden" value="0">'+
            '</td><td class="Cell KeyCell" style="display: none">'+
                '<input class="KeyInput" id="Key" maxlength="5" name="Key"'+ 'placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>'+
                '<textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>'+
                '<input id="ID" name="ID" type="hidden" value="0"></td>'
    );

答案 4 :(得分:-2)

您需要使用\

来转义单引号
<table id="myTable">
   <tbody>
      <tr>
          <td></td><td></td>
      </tr>
   <tbody>
</table>

$('#myTable tbody').append(
    ' <td style="width: 250px;">
                <select id="List" class="FixedWidth" onclick="this.style.width=\'auto\';" onchange="this.blur();" onblur="this.style.width=\'250px\';" style="display: none;">
                <div id="labelDiv"><label id="ComboBoxText"></label></div>
                <input id="TID" name="TID" type="hidden" value="0">
            </td>
            <td class="Cell KeyCell" style="display: none;">
                <input class="KeyInput" id="Key" maxlength="5" name="Key" placeholder="Hours" type="text" value="" style="color: rgb(169, 169, 169);"><br>
                <textarea maxlength="2000" class="NameInput" cols="20" id="Name" name="Name" placeholder="enter here" rows="2" style="color: rgb(169, 169, 169);"></textarea>
                <input id="ID" name="ID" type="hidden" value="0">
            </td>'
    )