Javascript 如何通过表单文本输入通过ajax发送json编码的数据

我使用ajax获取php json编码的数据，然后设置值以形成输入，然后将其发送到其他页面。但json获取的值不会在正常输入值发布时发布到其他页面。这是我正在使用的代码。我们将非常感谢你的帮助。 `

if（isset（$\u POST['send\u mail']））{
标题（'Content-Type:application/json'）；
$out=array（'a'=>“沃尔沃”，“b'=>“宝马”，“c'=>“丰田”）；
echo json_编码（$out）；
//打印（输出）；
退出（）；
}
?>
函数发送\邮件\测试（）{
var txt=$（“#test_txt”）.val（）；
如果（txt！=“”）{
$.ajax({
url:“chckvar.php”，
类型：“POST”，
//async:false，
数据类型：“JSON”，
数据：{
发送邮件：1，
txt_val:txt
},
成功：功能（数据）{
document.getElementById（'code_r'）.setAttribute（'value'，data.a）；
}    
});
//返回false；
}
else警报（“请输入一些文本”）；
//返回false；
}
`

sub.php

更新 我在另一个表单中使用onclick-on按钮，试图从那里更改操作页面，然后将表单提交到该操作，这可能吗

<script>
function action(){
var str = location.href;
 var x = "feedback.php?page="+str;
$("#quick_query").attr("action", x);
 $('#quick_query').submit();
}
</script>
<form id="myform" method="post" action="">
<input type="button" onclick="action()">
</form> 

函数动作（）{
var str=location.href；
var x=“feedback.php？page=“+str；
$（“快速查询”）.attr（“操作”，x）；
$（“#快速查询”）.submit（）；
}

它正在更改操作但不提交表单？我如何才能实现这一目标，这将非常有帮助。

试试以下方法：

<script>
$(function () {
    $('form[name="myform"]').on('submit', function (e) {
        e.preventDefault();
        var txt = $(this).find("#test_txt").val();

        if (txt.length > 0) {
            $.ajax({
                url: "chckvar.php",
                type: "POST",
                //async : false,
                dataType: "JSON",
                data: {
                    send_mail: 1,
                    txt_val: txt
                },
                success: function (data) {

                    $('#code_r').attr('value', data.a); //$('#code_r').val(data.a);
                    $(this).submit()
                }
            });
        } else alert("please enter some text");


    });
});
</script>
<form method="post" action="sub.php" name="myform">
<input type="text" name="name"  id="test_txt">
<input type="text"  name="code_r" id="code_r">
<input type="submit" name="_mail" value="send" >
</form>

$（函数（）{
$（'form[name=“myform”]”）。在（'submit'，函数（e）上{
e、 预防默认值（）；
var txt=$（this.find（“#test_txt”）.val（）；
如果（txt.length>0）{
$.ajax({
url:“chckvar.php”，
类型：“POST”，
//async:false，
数据类型：“JSON”，
数据：{
发送邮件：1，
txt_val:txt
},
成功：功能（数据）{
$（'code_r'）.attr（'value'，data.a）；//$（'code_r'）.val（data.a）；
$（this.submit（））
}
});
}else警报（“请输入一些文本”）；
});
});

回答：

代码的问题是提交事件甚至在调用ajax之前就发生了。在您的代码中进行了以下更改

HTML

表单上的onsubmit被删除&submit按钮更改为normal按钮。现在在send按钮上调用send_mail_test（）函数

JAVASCRIPT

<script>
    function send_mail_test() {
        var txt = $("#test_txt").val();
        if (txt != "") {
            $.ajax({
                url : "chckvar.php",
                type : "POST",
                //async : false,
                dataType : "JSON",
                data : {
                    send_mail : 1,
                    txt_val : txt
                },
                success : function(data) {
                    $('#code_r').val(data.a);
                    $('#myform').submit();
                }
            });
        }else{
            alert("please enter some text");
            return false;
        }
    }
function changeformaction(){
   $("#myform").prop('action','newaction.php');
   $('#myform').submit();
}
</script>

函数发送\邮件\测试（）{
var txt=$（“#test_txt”）.val（）；
如果（txt！=“”）{
$.ajax({
url:“chckvar.php”，
类型：“POST”，
//async:false，
数据类型：“JSON”，
数据：{
发送邮件：1，
txt_val:txt
},
成功：功能（数据）{
$（'code_r'）.val（data.a）；
$（'#myform'）。提交（）；
}
});
}否则{
警报（“请输入一些文本”）；
返回false；
}
}
函数changeformaction（）{
$（“#myform”）.prop（'action'，'newaction.php'）；
$（'#myform'）。提交（）；
}

这里在ajax成功回调中做了一个小的更改，在收到响应并在输入中设置值之后，表单将被提交

---

您的ajax文件中不需要任何更改。

即使我将名称留空也无法工作它不会显示警报@madalin ivascuco您能帮我看一下我的更新吗？它很紧急。当然，我愿意，让我检查一下您更新的问题，然后尝试解决it@Share有趣-检查我的更新答案。我想这就是你想要的。不，他们和以前的表格没有关系。我希望通过Javascript单击另一个表单的按钮，将函数名从action（）更改为其他名称，这样代码就可以工作了。

<script>
$(function () {
    $('form[name="myform"]').on('submit', function (e) {
        e.preventDefault();
        var txt = $(this).find("#test_txt").val();

        if (txt.length > 0) {
            $.ajax({
                url: "chckvar.php",
                type: "POST",
                //async : false,
                dataType: "JSON",
                data: {
                    send_mail: 1,
                    txt_val: txt
                },
                success: function (data) {

                    $('#code_r').attr('value', data.a); //$('#code_r').val(data.a);
                    $(this).submit()
                }
            });
        } else alert("please enter some text");


    });
});
</script>
<form method="post" action="sub.php" name="myform">
<input type="text" name="name"  id="test_txt">
<input type="text"  name="code_r" id="code_r">
<input type="submit" name="_mail" value="send" >
</form>

<form method="post" action="sub.php" name="myform" id="myform">
    <input type="text" name="name"  id="test_txt">
    <input type="text"  name="code_r" id="code_r">
    <input type="button" name="_mail" value="send" onclick="return send_mail_test()" >
</form>

    <br><hr><br>
<form method="post" action="xyz.php" name="anotherform" id="anotherform">
    <input type="button" name="change" value="Change action of above form" onclick="changeformaction();" >
</form>

<script>
    function send_mail_test() {
        var txt = $("#test_txt").val();
        if (txt != "") {
            $.ajax({
                url : "chckvar.php",
                type : "POST",
                //async : false,
                dataType : "JSON",
                data : {
                    send_mail : 1,
                    txt_val : txt
                },
                success : function(data) {
                    $('#code_r').val(data.a);
                    $('#myform').submit();
                }
            });
        }else{
            alert("please enter some text");
            return false;
        }
    }
function changeformaction(){
   $("#myform").prop('action','newaction.php');
   $('#myform').submit();
}
</script>