jquery - 動的に作成された div タグで readmore.js プラグインを使用する

Question

readmore.js は、div 全体を折りたたみたいときに美しく機能します。動的に作成された div で readmore プラグインを使用する方法を理解する必要があるため、テーブルの必要な部分だけを折りたたむことができます。

データベースから不明な数の行を返し、それらをテーブルに入れています。フィールドは、日付、連絡先名、およびコメントです。コメント フィールドは非常に長くなる可能性があるため、コメントごとに .readmore() を使用したいと思います。

私が現在行っているのは、コメント フィールドの div を動的に作成することです。アイデアは、その div id を .readmore() で使用することです

私のループは次のようになります。

// NoteTable is html file's div that will display all the returned data
// jquery append method is used to add a table and children rows:
$('#NoteTable').append('<table></table>'); 
var table = $('#NoteTable').children();
table.append('<tr><td colspan="2" class="sec-hd2">Discharge Planning Notes</td></tr>');

// Loop thru the returned data in the json object:
for (var i = 0; i < jsonNote.DATAREC.LIST.length; i++) {

  // Add a row for date info:
  table.append('<tr><td><b>Date:</b></td><td>' + jsonNote.DATAREC.LIST[i].COMMENT_DT + '</td></tr>');

  // Add a row for contact name info:
  table.append('<tr><td><b>Personnel:</b></td><td>' + jsonNote.DATAREC.LIST[i].COMMENT_PRSNL + '</td></tr>');

  // use the loop# to create a unique ID for a new div tag:
  var tempID = 'comment' + i
  //alert (tempID)

  // Add a row for the comments with a div tag around the comment string:
  table.append('<tr><td colspan="2"><div id="' + tempID + '">' + jsonNote.DATAREC.LIST[i].COMMENT + '</div><br />&nbsp;</td></tr>');

  // Use the readmore plugin on this new div:
  //table.append('$(#' + tempID + ').readmore()');
  // QUESTIONS/PROBLEMS WITH PREVIOUS LINE OF CODE:
  //  1) I'm not sure if I need to append it to the table like I do everything else
  //     (I don't get errors using tempID.readmore without the table.append but it doesn't work either
  //  2) I'm not sure how to do the quote marks/pound sign/dollar sign when I build this string

}

コードの最後の行をどのように構成しても、どのコメントにも「続きを読む」はありません。構文がどうあるべきかわかりません。どんなアイデアでも大歓迎です。それがより良いものであれば、私はこれを完全に作り直すことにオープンです。

詳細:続きを読む