Question

我想用JQuery启动Ajax操作。为此，我有以下代码，它也有效：

的jQuery

$(document).on('blur', '.priceConference', function(){  

                       var id = $(this).data("id2");  
                       var priceConference = $(this).text();  
                       edit_data(id,priceConference, "priceConference"); 

            });

HTML：

<td class="priceConference" data-id2="'.$row["idBookingConference"].'" contenteditable>'.$row["priceConference"].' €</td>

但是，我不想在没有焦点的情况下启动edit_data（）函数（'blur'）。但是，如果内容真的发生了变化，或者当用户输入“Enter”键时，我想启动该功能。

我已使用以下代码对其进行了测试，但它无效。它能是什么？

新的jQuery代码

$(document).ready(function(){
                $(".priceConference").change(function(){
                    var id = $(this).data("id2");  
                    var priceConference = $(this).text();  
                    edit_data(id,priceConference, "priceConference"); 
                });
            });

非常感谢你的帮助。

Answer 1

哟可以使用以下代码处理输入

occursRef="sgsnAddressLength"

Answer 2

对于contenteditable元素，请使用keydown事件。 change事件无效。要仅在实际更改值时调用函数，我已将原始值添加到发送Ajax之前检查的元素的数据中。

＆＃13;

$('td').on('keydown', function(e) { // For capturing the Enter key
  if (e.keyCode === 13 && $(this).text() !== $(this).data('originalValue')) {
    $(this).data('originalValue', $(this).text());
    e.preventDefault(); // no newline
    console.log('Call Ajax');
  }
}).on('focusin', function(e) { // Set value on click
  $(this).data('originalValue', $(this).text());
}).on('focusout', function(e) { // Check if value changed on click away
  if ($(this).text() !== $(this).data('originalValue'))
    console.log('Call Ajax');
});

＆＃13;

td {
  width: 100px;
  border: 1px solid black;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td contenteditable="true"></td>
    </tr>
  </tbody>
</table>

＆＃13;

在'Enter'上提交文本字段或者使用jQuery更改某些内容

2 个答案: