JQuery две функции для создания проблемы строки

Question

У меня была только одна функция, чтобы добавить еще одну строку в таблицу id = "tblOtherParties", и я работал нормально, но Когда я добавил вторую функцию, чтобы сделать то же самое с таблицей id = "tblHospitalAction", я получаю ошибку неопределенной строковой константы, но я не понимаю, почему она такая же, как первая функция.

Любая помощь будет принята с благодарностью.

У меня есть следующие функции

<script type="text/javascript">
 var counter = 1;
  function createNewRow (text1,text2){
  var first = counter++;
  $('#tblOtherParties > tbody').append('<tr><td>
   <input type="text" id="txtName_'+first+'" value="'+text1+'" />
   </td><td>
   <input type="text" id="txtRole_'+first+'" value="'+text2+'" />
   </td><td>
   <a class="deleteBtn"/>
   </td></tr>');
   }



 var counterHA = 1;
 function createNewRowHA (text1,text2){
  var first = counterHA++;
  $('#tblHospitalAction > tbody').append('<tr>
   <td>
   <input type="text" id="txtH_'+first+'" value="'+text1+'" />
   </td>
   <td>
   <input type="text" id="txtA_'+first+'" value="'+text2+'" />
  </td><td><a class="deleteBtn"/></td>
   </tr>');
   }

  $(document).ready(function(){
   $(".deleteBtn").live("click", function(){
   $(this).closest('tr').not(':only-child').remove();
   });

   $('#btnAddOther').click(function() {
     createNewRow('','');
    });

   $('#btnAddHA').click(function() {
     createNewRow('','');
    });

});
</script>

И следующие таблицы

<div >
  <span style="float:left;padding-top:34px;"><b>Other involved parties</b></span>
  <table style="float:left;" id="tblOtherParties">
   <thead>
    <tr>
     <td class="title">Name</td>
     <td class="title">Role</td>
     <td><input type="button" id="btnAddOther" value="Add"/></td>
   </tr>
 </thead>
  <tbody>
   <tr>
    <td><input type="text" id="txtName_0" size="35"/></td>
    <td><input type="text" id="txtRole_0" size="35"/></td>
    <td><a class="deleteBtn" /></td>
  </tr>
  </tbody>
</table>
</div>

<div >
  <span style="float:left;><b>Other involved parties</b></span>
  <table style="float:left;" id="tblHospitalAction">
   <thead>
    <tr>
     <td class="title">Name</td>
     <td class="title">Role</td>
     <td><input type="button" id="btnAddHA" value="Add"/></td>
   </tr>
 </thead>
  <tbody>
   <tr>
    <td><input type="text" id="txtH_0" size="35"/></td>
    <td><input type="text" id="txtA_0" size="35"/></td>
    <td><a class="deleteBtn" /></td>
  </tr>
  </tbody>
</table>
</div>

Answer 1

Ваши строки охватывают несколько строк в вашем фактическом источнике, или вы только что предварительно их утвердили для отображения в своем вопросе? Строки, которые охватывают несколько строк, должны либо заканчиваться на каждой строке и соединяться со следующей, либо вы должны экранировать символ новой строки:

// Unterminated string constant on the first line
"this is a
 test string that spans multiple lines"

// Escaping the newline character
"this is a \
 test string that spans multiple lines"

// Concatenating each line:
"this is a "
+ "test string that spans multiple lines"

Самая большая разница между 2-м и 3-м заключается в том, что 2-й будет сохранять новые строки в строке, третий не будет, если вы не добавите их вручную, используя \n или \r\n. Недостатком второго является то, что ВСЕ другие пробельные символы (пробелы, символы табуляции и т. Д.) Между разделителями строк являются частью строки, что затрудняет поддержание вашего кода в чистом виде.

Answer 2

Когда строковые литералы Javascript занимают несколько строк, в конце каждой строки должен быть обратный слеш ().

http://www.codehouse.com/javascript/tips/string_multiline/