jquery - JQueryは送信時にdivを更新します

Question

ユーザーが単純なフォームを送信したときにdivを更新したかったのです。しかし、なぜそれが機能しないのか理解できないようです。（JQueryとAjaxを使用するのは初めてです）

私のスクリプト：

 <script src="static/jquery.js"></script> 
        <script>
                $('#submit_div').click(function(){
                    var data: $("#name").val();
                    var datastr: 'name='+data;
                    $.ajax{
                        type: "POST",
                        url: $(this),
                        data: datastr,
                        success: function(data){
                            $("#content").replaceWith($('#content'),$(data));
                            }
                    }
                });

        </script>

私のHTML：

<div id="content">
          <div id="form_div">
            <form method="POST">
                <div id="form"> 
                    <div id="name_div"> name <input type="text" id="name" name="name"/></div>
                    <div id="submit_div">  <button type="submit" id="submit" name="submit">submit</button></div>
                </div>
            </form>
 <div style="clear:both;"></div></div>             

Answer 1

エラー

var data: $("#name").val();
var datastr: 'name='+data;
$.ajax{...}
$("#content").replaceWith($('#content'),$(data));

修理済み

$('#submit_div').click(function(e){
    e.preventDefault();                
    var data = $("#name").val();
    var datastr='name='+data;
    $.ajax({
        type: "POST",
        url: $(this),
        data: datastr,
        success: function(data){
            $("#content").replaceWith(data);
        }
    });
});

Answer 2

コードに構文エラーがあります。あなたは書くべきです：

var data = $("#name").val();
var datastr = 'name='+data;

Answer 3

jQuery Loadメソッドを試しましたか？

http://api.jquery.com/load/

Answer 4

戻り値のデータは、uが置き換えたいものだと思います（正しい場合）。次に、このように使用します。

$("#content").replaceWith(data);

Answer 5

$("#form_div form").submit(function(e){
  e.preventDefault();
  var data = $("#name").val();
  $.post('/some/url/file.php',{name: data},function(data){
    $("#content").html(data);
  });
});

フォーム送信イベントを処理し、デフォルトのアクションを防止する必要があります。