按在文本区输入时提交表单(Form submitting when pressing enter i

我一直在尝试各种方法来获取形式打回车键时提交。我知道它的工作原理与输入字段，但是因为这将是一个评论，它需要一个文本区域。

这是我目前有形式有一个按钮提交。

$('.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('<li><img class="commentUserImg" src="' + profilepic + '"><div class="commentUser">' + username + '</div><div class="commentText">' + dataString + '</div></li>');

            $('.messageTextarea').val(''); // Remove comment from TextArea
        }
    });
    return false;
});

它的工作原理像它应该。我想删除提交按钮，只是当用户点击回车键的形式提交。我知道有些人反对这项建议，但这个网站的用户将被用来打从Facebook和这样的进入。

我试过在等这个方法，但它似乎没有工作。

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

这里是我的表单代码

<form>
   <textarea class="messageTextarea" onfocus="if(this.value==this.defaultValue)this.value=\'\';" onblur="if(this.value==\'\')this.value=this.defaultValue;">Write your comment here...</textarea>
    <input type="submit" data-the_id="' + theid + '" name="submit" class="messageSubmit" id="submit_btn" value="Submit your comment">
 </form>

任何帮助将是巨大的。此外，如果有人知道如何添加，如果功能将防止从形式与在textarea的当前默认值提交，这将是真棒。目前，随着textarea的是如何设置的，现在，如果你只是点击提交，将提交在这里写下您的评论...

谢谢

编辑：难道周围的工作是...有一个按钮提交，像正常的，但有它隐藏的，当你按下回车键就会触发该按钮的电话吗？ 但后来......我会遇到同样的问题，进入无所事事的textarea的，除了打入一个新的行...

Answer 1:

试试这个的jsfiddle

HTML：

<form>
   <textarea class="messageTextarea">Write your comment here...</textarea>

 </form>

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('<li><img class="commentUserImg" src="' + profilepic + '"><div class="commentUser">' + username + '</div><div class="commentText">' + dataString + '</div></li>');

            $('.messageTextarea').val(''); // Remove comment from TextArea
        }
    });

    return false;
});

Answer 2:

我想你也想给用户的能力使用移去新的生产线。

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

看到这一点： http://jsfiddle.net/almirsarajcic/Gd8PQ/

它为我工作。

此外，您还需要删除提交按钮，你目前有。

Answer 3:

尝试这种方式

<form method="post" action="">
    <textarea></textarea>
</form>

<script type="text/javascript" src="./lib/js/jquery/jquery-1.8.1.min.js"></script>

<script type="text/javascript">
    jQuery('textarea').keydown(function(event) {
        if (event.keyCode == 13) {

            this.form.submit();
            return false;
         }
    });
</script>

我测试了它，和它的工作

我只添加参数event的函数头

文章来源: Form submitting when pressing enter in Textarea