HTMLにAJAXのjQueryを使用して、この値を印刷する方法

HTMLHTMLにAJAXのjQueryを使用して、この値を印刷する方法

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script type="text/javascript"> 

$(document).ready(function(){ 
$("#but").click(function(){ 

    $.ajax({ 
     url: "action.php", 
     type: "POST", 
     dataType: "text", 
     success: On_success, 
     error: On_error 
    }); 

    function On_success(response){ 
     alert(response); 
     //$("#show").html(response); 
    } 

    function On_error(data){ 
     console.log(data); 
    }  
    }); 
    }); 

    </script> 
</head> 
<body> 

<form action="action.php" method="post"> 
<input type="text" name="mine"> 
<input type="submit" id="but"> 
</form> 
<p id="show">HI</p> 
</body> 
</html>

PHP

<?php 

$name = $_POST['mine']; 

echo $name; 

?>

入力ボックス、ボタンおよびHTML 上のパラタグを提出があります私は値を入力してボタンをクリックします.....値はPHPファイルに渡されます。値がエコーされます。

今、私は

（入力ボックスからの値であるべきである）。..応答をフェッチAJAXを使用したが、私が受け取る応答は次のとおりです。

Image of response

し、それがPHPのページに行きます入力ボックスの値を表示します。

paraタグでAJAX応答を使用して値を印刷する方法はありますか？が助けてください事前に

おかげ

出典

2016-08-21 Ankit

javascriptでinnerHtmlを使用するか、jqueryでhtmlを使用します – Poria

ajaxを使用して投稿したい場合は、入力タイプの送信とフォームアクションを使用していますか？ – Poria

私は非常に少ない経験を持っています。 AJAXと一緒に...あなたは私を助けてくれますか？ @Poria .....私は値を入力し、その値は同じページにパラレルタグ – Ankit

いくつか

あなたがスコープどこに後で呼び出したいページに

移動機能を滞在したい場合

フォームを送信していません彼らは利用可能であるか、または匿名の機能としてそれらを持っています：

このよう

：

$(function(){ 
    $("form").on("submit",function(e){ 
    e.preventDefault(); // or make the button it type="button: 
    var data = $(this).serialize(); 
    $.ajax({ 
     url: "action.php", // or $(this).attr("action"), 
     type: "POST", 
     data: data, 
     success: On_success, 
     error: On_error 
    }); 
    }); 
}); 
function On_success(response){ 
    $("#show").html(response); 
} 

function On_error(data){ 
    console.log(data); 
}

出典

2016-08-21 16:40:36 mplungjan

まだ同じ応答が返ってきています@mplungjan – Ankit

あなたは鉱山を送りましたか（私は – mplungjan

のデータをシリアル化するようにスクリプトを更新しました....うまく動作します:)）..... beeen朝（インド時間） – Ankit

問題は、あなたのaction.phpページにあるそれはあなたのPOSTデータを取得していません。あなたはajaxでそれを送る必要があります。

$("form").submit(function(e) {  // Change the event to form submit 
    e.preventDefault(); 
    $.ajax({ 
     url: $(this).attr("action"), // Use the specified form action 
     type: "POST", 
     data: $(this).serialize(),  // All form data is serialized and sent to the action page 
     success: On_success, 
     error: On_error 
    }); 
}); 

function On_success(response){ 
    console.log(response);  // Debug your response. 
    $("#show").html(response); 
}

これで正常に動作します。

出典

2016-08-21 16:42:14

それでもまだPHPページが表示されます値....私はHTMLページ自体にその値を印刷したいです – Ankit

それは正常に動作するはずです。あなたは答えのように正確に試しましたか？ –

HTMLにAJAXのjQueryを使用して、この値を印刷する方法

答えて

関連する問題