通过jQuery和Ajax从用户输入更新textarea

时间:2013-11-20 02:20:01

标签: php jquery ajax

我正在尝试更新我的php文件中的值,并使用jquery和ajax将其显示在textarea中。简而言之,我有:
1-带有用户输入和提交按钮的表单和文本区域
2-一个名为data.php的PHP文件 3 - 和html文件
这是我的代码

<form>
<input type="text" name="name"><br>
<textarea name="wstxt" id="wstxt" cols="40" rows="5"></textarea>
<input type="button" name="txta-update" id="txta-update" value="Update Textarea"  />
</form>

PHP简单如下:

<?php
$name = "Jordano";
echo $name;

这里是jquery

$(document).ready(function() {
   $('#txta-update').click(function() {

          $.ajax({ 
              type: "GET", 
              url: "data.php",//get response from this file
              success: function(response){ 

               $("textarea#wstxt").val(response);//send response to textarea
            }
        });
});
});

你能告诉我如何将输入值发送到php并从新值更新textarea吗? 感谢

更新 enter image description here

1 个答案:

答案 0 :(得分:1)

像这样发送数据

data:{name:$('input[name="name"]').val()}

你的js文件变成了

 $.ajax({
     type: "GET",
     url: "data.php", //get response from this file
     data:{name:$('input[name="name"]').val()},
     success: function (response) {

         $("textarea#wstxt").val(response); //send response to textarea
     }
 });

<小时/> 或

$(document).ready(function () {
    $('#txta-update').click(function () {
        var name_val = $('input[name="name"]').val();
        $.ajax({
            type: "GET",
            url: "data.php", //get response from this file
            data: {
                name: name_val
            },
            success: function (response) {

                $("textarea#wstxt").val(response); //send response to textarea
            }
        });
    });
});

<小时/> 在PHP

中获取价值
<?php
$name = $_GET['name'];
echo $name;
?>