按下在Textarea中输入时的表单提交

我一直在尝试各种方法，以便在按下回车键时提交表单。 我知道它适用于输入字段，但因为这将是一个注释，它需要是一个文本区域。

这是我目前用表单提交一个按钮。

$('.messageSubmit').live('click', function(){ var name = $(this).siblings('.messageTextarea').val(); var theid = $(this).attr('data-the_id'); var dataString = name; $.ajax({ dataType: 'json', url: "https://api.instagram.com/v1/media/"+$(this).attr('data-the_id')+"/comments?"+hash, type: "POST", data: "text="+dataString, success: function(data) { // finish load console.log(data, dataString, 'fail'); }, error: function(data) { var username = JSON.parse(localStorage.getItem('iguser')); var profilepic = JSON.parse(localStorage.getItem('iguserimg')); //console.log(data, dataString, 'succ'); $('.box[data-the_id="' + theid + '"]').children('.postMessage').children('.messageComments').append('
' + username + '
' + dataString + '
'); $('.messageTextarea').val(''); // Remove comment from TextArea } }); return false; }); 

它的工作原理应该如此。 我想删除提交按钮，只需在用户点击回车键时提交表单即可。 我知道有些人建议不要这样做，但是这个网站上的用户将习惯于从Facebook等用户进入。

我已经尝试过这样的方法，但它似乎没有用。

 $('.messageTextarea').keydown(function() { if (event.keyCode == 13) { this.form.submit(); return false; } }); 

这是我的表单代码

 
 Write your comment here...   

任何帮助都会很棒。 此外，如果有人知道如何添加一个if函数，该函数将阻止表单使用Textarea中的当前默认值进行提交，那将是非常棒的。 目前，关于如何设置textarea，如果你只是点击提交，它将提交在这里写你的评论…

谢谢

编辑：可以解决…有一个按钮提交，像平常一样，但隐藏它，当你点击输入它会触发该按钮的调用？ 但那时……我遇到了同样的问题，即除了闯入一条新线外，在textarea中什么都不做……

Answer 1

试试这个jsfiddle

HTML：

 
 Write your comment here... 
​ 

JS：

  $('.messageTextarea').keydown(function(event) { if (event.keyCode == 13) { $(this.form).submit() return false; } }).focus(function(){ if(this.value == "Write your comment here..."){ this.value = ""; } }).blur(function(){ if(this.value==""){ this.value = "Write your comment here..."; } }); $("form").submit(function(){ var name = $(this).siblings('.messageTextarea').val(); var theid = $(this).attr('data-the_id'); var dataString = name; $.ajax({ dataType: 'json', url: "https://api.instagram.com/v1/media/"+$(this).attr('data-the_id')+"/comments?", type: "POST", data: "text="+dataString, success: function(data) { // finish load console.log(data, dataString, 'fail'); }, error: function(data) { var username = JSON.parse(localStorage.getItem('iguser')); var profilepic = JSON.parse(localStorage.getItem('iguserimg')); //console.log(data, dataString, 'succ'); $('.box[data-the_id="' + theid + '"]').children('.postMessage').children('.messageComments').append('
' + username + '
' + dataString + '
'); $('.messageTextarea').val(''); // Remove comment from TextArea } }); return false; });​​   $('.messageTextarea').keydown(function(event) { if (event.keyCode == 13) { $(this.form).submit() return false; } }).focus(function(){ if(this.value == "Write your comment here..."){ this.value = ""; } }).blur(function(){ if(this.value==""){ this.value = "Write your comment here..."; } }); $("form").submit(function(){ var name = $(this).siblings('.messageTextarea').val(); var theid = $(this).attr('data-the_id'); var dataString = name; $.ajax({ dataType: 'json', url: "https://api.instagram.com/v1/media/"+$(this).attr('data-the_id')+"/comments?", type: "POST", data: "text="+dataString, success: function(data) { // finish load console.log(data, dataString, 'fail'); }, error: function(data) { var username = JSON.parse(localStorage.getItem('iguser')); var profilepic = JSON.parse(localStorage.getItem('iguserimg')); //console.log(data, dataString, 'succ'); $('.box[data-the_id="' + theid + '"]').children('.postMessage').children('.messageComments').append('
' + username + '
' + dataString + '
'); $('.messageTextarea').val(''); // Remove comment from TextArea } }); return false; });​​ 

Answer 2

我想你也想让用户使用shift去新线。

 $('.messageTextarea').on('keyup', function(e) { if (e.which == 13 && ! e.shiftKey) { // your AJAX call } }); 

见： http ： //jsfiddle.net/almirsarajcic/Gd8PQ/

它对我有用。

此外，您需要删除当前的提交按钮。

Answer 3

试试这种方式

我测试了它，它工作了

我只在函数头中添加了参数event