2017-01-10 10 views
0

私は、フォームにユーザーがテキストを入力し、キーボードのcommand+enterを打つたびに提出するjQueryを使用しようとしていますid送信ボタンのない最も近いフォームを送信しますか?

でのみtextareaと隠しフィールドから成る多くフォームでページを持っています。そのために

私は一部が正常に動作しますが、私は自分のフォームを送信しようとすると、スクリプトの実行を停止すること

$('textarea').keydown(function(e) { 
    if(e.keyCode == 13 && e.metaKey) { 

を使用しています。私はclosest('form')と提出していくつかの混乱をやっていると確信しています。私はそれが$('textarea').closest('form').submit(function() {

の内側に私はcommand+enterが私のprocessing URLに入力されたために、フォームの内容を渡すことができますどのように任意のアイデアに入ることはありませんデバッグするときにここで

は私の完全なコード

$('textarea').keydown(function(e) { 
    if(e.keyCode == 13 && e.metaKey) { 
     $('textarea').closest('form').submit(function() { 
     $.post("someurl.php", $(this).serialize(), function(data) { 
     alert(data); 
    }); 
    }); 
    }; 
}); 

のですか?

私がいることがわかり、コードのデバッグ中に任意のヒントは、フォーム

<form action="#"> 
    <div class="col-xs-1"> 
    <textarea class="form-control" rows="5" placeholder="Enter your answer"></textarea> 
    <input type="hidden" name="idval" value="xxxx"> 
    </div> 
    </form> 

EDIT 2

ため おかげ

UPDATE

HTMLコードを理解されるであろうパラメータは正しく渡されますしかし、ある時点でjqueryは値を失います。

下の投稿のフィドルがうまくいきますが、私がコードをダウンロードしてローカルホストでテストすると、それほどうまくいきません。ここで

コード

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <meta name="robots" content="noindex, nofollow"> 
    <meta name="googlebot" content="noindex, nofollow"> 


<script 
    src="https://code.jquery.com/jquery-2.2.4.js" 
    integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" 
    crossorigin="anonymous"></script> 


    <style type="text/css"> 

    </style> 

    <title> by b</title> 


<script type='text/javascript'>//<![CDATA[ 
window.onload=function(){ 
$('textarea').keydown(function(e) { 
    if(e.keyCode == 13 && e.metaKey) { 
     // e.preventDefault(); 
     $.post($(this).closest("form").attr("action"), { html: $(this).closest("form").serialize()}, function(data) { 
      alert(data); 
     }); 
    } 
}); 
}//]]> 

</script> 

</head> 

<body> 
    <form action="#"> 
<textarea name="area1"></textarea> 
</form> 

<form action="#"> 
<textarea name="area2"></textarea> 
</form> 

</body> 

</html> 

は、任意の手がかりでありますか?

+0

close( 'form')。submit(function(){... 'これはすべての' textarea'要素を見つけ、それぞれの 'form'に' submit'ハンドラを付けます。何も 'submit'イベントを引き起こさない –

+0

ありがとう@AlexK、' $ .post( " ) '? – JordanBelf

+0

それでも問題が解決しない場合は、HTMLマークアップを追加すると便利です。 – bassxzero

答えて

1

イベントハンドラを別のイベントハンドラ内に定義しないでください。現在のフォームを投稿するだけです。

$('textarea').keydown(function(e) { 
    if(e.keyCode == 13 && e.metaKey) { 
     $.post($(this).closest("form").attr("action"), $(this).closest("form").serialize(), function(data) { 
      alert(data); 
     }); 
    } 
}); 
+0

'$(this).serialize ) 'は' textarea'だけを参照します - フォーム全体ではないのですか? –

+0

はい、これを試すとコードが実行されますが、現在のフォーム要素だけでなく、ページのHTML全体が表示されます。 – JordanBelf

+0

私もこの '$を試しました。serialize()、function(data){ alert(data); }この記事は、以前は次のIDで公開されていました: );でも、それでも同じ結果になる。それでもHTML全体を渡しています – JordanBelf

関連する問題