0

私はコメントとして1つの列を持っています。ユーザーが好きなようにコメントを入力できるようにして、このテーブルを見るたびに表示する必要があります。私は何度も検索し、最後にこのコードを使用しましたが、ユーザーがコメントでは、編集可能である必要がありますが、機能していません 

$(document).ready(function() {
$('#mylist_remark').on('click', '.Edit', function() {
        $(this).closest('tr').find('td:eq(1)').each(function() {
            // replace the existing text with a textbox containing that text
            var existingVal = $(this).text();
            $(this).html('<input type="text" value="' + existingVal + '" >');
        });
    });

    // when the user is finished editing, change the value and remove the textbox,and display edited text
    $('#mylist_remark').on('focusout', 'td input', function() {
        $(this).parent().html( this.value );
    });
});

スクリプト

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

テーブルコード

    <table id="mylist_remark">
    <caption>SELECTED CANDIDATE LIST</caption>
    <!-- headings -->
        <tr>
          <th> </th>
          <th>REMARK</th>
        </tr>
   <?php $i=0;
    while($data_set = mysql_fetch_array($mresult_set))
        {     
            echo "<tr id=\"{$listrowid}\">";                                
            echo "<td><a href\"\" class=\"Edit\">remark</a></td>";
            echo "</tr>";
            $i++;                       
            }?>
    </table>

ありがとう

4

1 に答える 1

1

このすべてを行うのではなく、「contenteditable」属性の使用を検討しましたか?

<td class="editable" contenteditable="true">Something</td>

$("#mylist_remark .editable").bind("blur", function(e) { 
  console.log($(e.target).text());
  $.post("/somewhere", {remark: $(e.target).text(), candidate_id: $(e.target).nearest("tr").attr("id")}, function() { console.log("success"); });
  //save the result to the server or whatever you need to do to make it persist
});

また、「enter」および「escape」キーダウン イベントをバインドすることもできます。

于 2013-01-19T10:52:45.900 に答える