如何向jEditable输入框添加事件监听器？

Question

如何向jEditable输入框添加事件监听器？

默认情况下，使用ENTER键提交，但我需要使用其他按键来提交值，该怎么办？

 $('.editable').editable(function(value, settings) { 
     console.log(this);
     console.log(value);
     console.log(settings);
     return(value);
  }, { 
     width: "100%"
     onblur: 'submit'
 });

- Astronaut

---

你需要哪些其他按键才能提交？ - Jason Towne

和空格是我需要的。

- Astronaut

Answer 1

您可以向文档添加一个`keypress`事件监听器，以便监听这些额外按键的按下。

每当您开始编辑某些内容时，jEditable会向页面添加一个类为`editable`的`form`。使用`.on()`来注册事件监听器将确保处理程序在动态添加`form`块到页面时也会被触发。

这里是一个工作示例。

这只是展示了如何确定何时按下了“空格”或“#”。您需要修改代码使其适合您的需求。

<form class="editable">
  <input type="text" class="editable" />
</form>​

$(document).ready(function() {
    $('form.editable').on('keypress', function(e) {
        if (e.keyCode === 32 || e.keyCode === 35) alert('Time to submit!');
    });
});​

- Jason Towne

---

我实际上将jEditable更改为kisten，以便它像监听escape键一样监听事件...你的解决方案更干净;) - Astronaut

Answer 2

Jason的解决方案行不通：jEditable在事件（单击、双击等）上添加表单和输入，因此当您在文档准备就绪时执行函数时，它们不存在！

您可以在input.keydown之前添加此代码来修改jEditable：

input.keyup(function(e){if (e.keyCode === 32 || e.keyCode === 35) alert('是时候提交了！');});

- creaweb80